包简介

Advanced laravel blade.

README 文档

README

This package adds some features to make it easier to work with components and html tags in laravel blade.

<AppLayout>
    <Slot title>BladeX</Slot>
    
    <MyButton type="primary">Click here</MyButton>
</AppLayout>

BladeX v2

Requirements

Php 8.1 or higher
Laravel 10.0 or 11.0

Installation

Install the package with composer:

composer require rapid/bladex

Then clear the compiled view caches to recompile blade files:

php artisan view:clear

Compiling

BladeX converts the components tag into proper php code at compile time! Some operations are not at runtime.

This means that if you change something that doesn't recompile the source file, but affects the code, you have to clear the compiled caches to recompile:

php artisan view:clear

Components

You can call components by <HtmlTag> in anywhere you want!

Name Rule

The component call name should be PascalCase, but the file name should be kebab-case.

Component Path

Every folder named components is a component path.

Exmaples:

View Path	Tag Name	View-Based Name
`components/button.blade.php`	`Button`	`button`
`components/button/red.blade.php`	`Button.Red`	`button.red`
`components/button/index.blade.php`	`Button`	`button`
`componets/posts/post-card.blade.php`	`Posts.PostCard`	`posts.post-card`
`posts/components/post-card.blade.php`	`Posts.PostCard`	`posts.post-card`
`posts/actions/components/del.blade.php`	`Posts.Actions.Del`	`posts.actions.del`

Call Component

Just type <TagName>:

<Button class="bg-red-500">Delete</Button>
<Button.Red>Cancel</Button.Red>
<Posts.PostCard :post="$post" />

Note: If the component file is not found at compile time, the component will not compile.

Slots

In the blade, you must write <x-slot name="slot_name"> to define slot value.

But in BladeX, just type <Slot slot_name>:

<Dropdown>
    Select Option
    
    <Slot options>
        <li>Option 1</li>
        <li>Option 2</li>
    </Slot>
    
    <Slot icon>
        <svg>...</svg>
    </Slot>
</Dropdown>

Use Component

If you want to call component by alias (like programming use keyword), you can use magic blade directive @use:

@use(Posts.Actions.Del)

<Del :post="$post" />

Add as keyword to set alias:

@use(Posts.Actions.Del as PostDelete)

<PostDelete :post="$post" />

You can also use a component folder:

@use(Posts.Actions as PostAct)

<PostAct.Del :post="$post" />

Use View Like Components

If you want to use it by specifying the view path, you can use this syntax:

@use('home.post' as Post)

<Post />

<!-- Automatically convert 'app-layout' to 'AppLayout' as alias! -->
@use('layout.app-layout')

<AppLayout />

Use All (*)

If you want to use all components in same directory/name, you can write @use directive with .* suffix:

@use(Posts.Actions.*)

<!-- Calls <Posts.Actions.Del> if exists -->
<Del :post="$post" />
<!-- Calls <Posts.Actions.Create> if exists -->
<Create :post="$post" />

@use('layouts.*')

<!-- Calls 'layouts.app-layout.blade.php' if exists -->
<AppLayout>
    Hello World
</AppLayout>

Note: Try not to spam this feature.

Because this feature searches among the files and slows down the compiling view

However, all lookups are done at compile time only. So don't worry about the slowness of the website :)

Layouts

You can create layouts with BladeX. For example:

layouts/app.blade.php

<html lang="en">
<head>
    <title>{{ $title }}</title>
</head>
<body>
    {{ $slot }}
</body>
</html>

index.blade.php

@use('layouts.app' as AppLayout)

<AppLayout>
    <Slot title>BladeX</Slot>
    
    Welcome to BladeX!
</AppLayout>

You don't need @use tag anymore if you create .blade.php configuration file! More Info

Directive Helpers

Layout

Layout equals to @extends, but only adds layouts. name to your view name. For example @layout('guest') converts to @extends('layouts.guest') and @layout('admin.main') to @extends('admin.layouts.main')

@layout('guest')

@section('content')
    <h1>Hello World</h1>
@endsection

Also, you can use components for layouts.

Partial

Partial equals to @include, but only adds partials. name to your view name. For example @partial('edit') converts to @include('partials.edit') and @partial('admin.delete') to @include('admin.partials.delete')

<AppLayout>
    @partial('users.my-info')
</AppLayout>

Current Directory Name

You can use @ in @include, @use, @layout, @extends, @partial to use current path reference.

admin/dashboard.blade.php:

@use('admin.btn-create')
@use('@btn-create')

@include('admin.partials.create-user')
@include('@partials.create-user')
@partial('@create-user')

Configuration

Add the .blade.php file wherever you want to apply the sub files:

<?php

# Note: After editing this source, run `php artisan view:clear` one time.

return [
    # Use components alias
    'use' => [
        // Example:
        // 1- 'Posts.PostCard'
        // 2- 'posts.post-card'
        // 3- 'Buttons.Red' => 'Alias',
        // 4- 'Buttons.*'
        
    ],
];

For example, create file resources/views/.blade.php with the following content:

<?php

# Note: After editing this source, run `php artisan view:clear` one time.

return [
    # Use components alias
    'use' => [
        // Example:
        // 1- 'Posts.PostCard'
        // 2- 'posts.post-card'
        // 3- 'Buttons.Red' => 'Alias',
        // 4- 'Buttons.*'
        
        'layouts.app' => 'AppLayout',
        'layouts.guest' => 'GuestLayout',
    ],
];

Now, you can use layouts with components in any blade files in resources/views

<AppLayout>
    <p>Content</p>
</AppLayout>

Support

Telegram: @Mahdi_Saremi
Instagram: @mahdi_saremi_org

rapid/bladex 适用场景与选型建议

rapid/bladex 是一款基于 PHP 开发的 Composer 扩展包，目前已累计 8 次下载、GitHub Stars 达 2，最近一次更新时间为 2024 年 04 月 02 日，在 PHP 生态内属于活跃度较高的组件。

它主要适用于以下技术方向：「php」「html」「component」「laravel」「blade」等业务场景。在实际项目中，围绕这些方向常见需要落地的问题包括：接口对接、性能调优、并发安全、与既有框架（Laravel / ThinkPHP / Yii / Webman 等）的兼容适配，以及生产环境的日志埋点与稳定性保障。

我们在过去多个企业项目中使用过 rapid/bladex 或与其功能相近的方案，如果你在选型或落地过程中遇到问题，例如 版本兼容、二次改造、私有化封装、与内部系统对接、生产 BUG 排查，欢迎联系我们协助评估。

围绕 rapid/bladex 我们能提供哪些服务？

定制开发 / 二次开发

基于 rapid/bladex 在你已有业务上做功能扩展、字段裁剪、UI 适配、与内部账号 / 权限 / 日志系统的深度对接。

BUG 修复 & 性能优化

线上偶发问题、内存泄漏、慢查询、并发异常等排查修复；针对高流量场景做缓存、队列、索引层面的调优。

项目外包 & 长期维护

承接完整的项目从需求 → 设计 → 开发 → 上线 → 长期运维；也可按月提供技术保姆服务。

yvsm@zunyunkeji.com QQ：316430983 微信：yvsm316 西安尊云信息科技 · 专注 PHP / Go / 分布式系统研发

与 rapid/bladex 相关的其它包

同方向 / 同关键字的高下载量 PHP Composer 包推荐，方便对比选型：

dg/texy 159

Texy converts plain text in easy to read Texy syntax into structurally valid (X)HTML. It supports adding of images, links, nested lists, tables and has full support for CSS. Texy supports hyphenation of long words (which reflects language rules), clickable emails and URL (emails are obfuscated again

fsi/datasource 8

FSi DataSource Component

axelarge/html-helpers 6

HTML and form generation

skeeks/cms-user-personal-area 0

Priveate for SkeekS CMS

eyupcanakman/simple-html-dom 1

A modern HTML DOM parser for PHP using DOMDocument and Symfony CssSelector.

lacus/utils 0

Reusable utilities library for Lacus Solutions' packages (type description, HTML escaping, random sequences)

rapid/bladex

包简介

关键字：