madeitbelgium/jetstrap

A Laravel 10 包,用于轻松将 Laravel Jetstream 生成的 TailwindCSS 资源切换到 Bootstrap 5,并使用 Vite。

安装: 838

依赖项: 0

建议者: 0

安全性: 0

星级: 1

关注者: 1

分支: 120

语言:Vue

1.0.0 2023-06-21 13:34 UTC

This package is not auto-updated.

Last update: 2024-09-12 18:10:08 UTC


README

Latest Stable Version Total Downloads License

描述

Jetstrap 是一个轻量级的 Laravel 10 包,专注于 Laravel 应用程序中安装的 Jetstream / Breeze 包的 VIEW 方面,因此在交换时,您的项目的 ActionMODELCONTROLLERComponentAction 类仍然由 Laravel 开发团队 100% 处理,没有任何额外的复杂性层次。

目录

安装

安装 Jetstream

您可以使用 Composer 将 Jetstream 安装到您的 Laravel 项目中

composer require laravel/jetstream

如果您选择通过 Composer 安装 Jetstream,您应该运行 jetstream:install Artisan 命令。此命令接受您首选的堆栈名称(Livewire 或 Inertia)。强烈建议在开始 Jetstream 项目之前阅读 Livewire 或 Inertia 的完整文档。此外,您还可以使用 --teams 开关启用团队支持

使用 Livewire 安装 Jetstream

php artisan jetstream:install livewire --teams

或者,使用 Inertia 安装 Jetstream

php artisan jetstream:install inertia --teams

安装 Jetstrap

使用 Composer 将 Jetstrap 作为开发依赖项安装到您的 Laravel 项目中

composer require madeitbelgium/jetstrap --dev

无论您如何安装 Jetstream,Jetstrap 命令与 Jetstream 非常相似,因为它接受您要交换的堆栈名称(Livewire 或 Inertia)。

在执行交换之前安装和配置 Laravel Jetstream 非常重要。

在开始 Jetstrap 项目之前,强烈建议您阅读 Jetstream 的完整文档。此外,您还可以使用 --teams 开关交换团队资源,就像在 Jetstream 中做的那样。

php artisan jetstrap:swap livewire

or

php artisan jetstrap:swap livewire --teams

php artisan jetstrap:swap inertia --teams

这将发布覆盖,以启用类似过去的 Bootstrap 功能!

完成安装

安装 Jetstrap 并交换 Jetstream 资源后,从 package.json 中删除 tailwindCSS 及其依赖项(如果有),然后安装和构建您的 NPM 依赖项,并迁移数据库

npm install && npm run dev

php artisan migrate

额外功能

分页

值得注意的是,Laravel 8 仍然包含使用 Bootstrap CSS 构建的分页视图。要使用这些视图而不是默认的 Tailwind 视图,您可以在 AppServiceProvider 中调用 paginator 的 useBootstrap 方法

<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Illuminate\Pagination\Paginator;

class AppServiceProvider extends ServiceProvider
{
    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }

    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        Paginator::useBootstrap();
    }
}

预设

预设是使用 bootstrap 构建的第三方自定义模板。我们考虑过,您使用 Laravel 或 Laravel Jetstream 提供的默认模板的可能性有多大。

假设您在运行任何类型的脚手架之前就已经知道您想要的方向,因此如果您想使用 CoreUi 或 AdminLte 预设,则应在第一次运行任何 swap 命令时在服务提供程序中指定选择(JetstrapFacade::useCoreUi3()JetstrapFacade::useAdminLte3())。

如果您在运行了交换命令后改变主意,决定使用预设,那么请再次运行jetstrap:swap命令。

核心 UI

Core Ui让您节省数千个小时的无价时间,因为它提供了您创建现代、美丽和响应式应用程序所需的一切,正如其网站所述。

请访问CoreUI的文档以获取更多关于如何使用的详细信息。

要使用Core Ui预设,只需在您的AppServiceProvider中调用useCoreUi3方法。

<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use MadeITBelgium\Jetstrap\JetstrapFacade;

class AppServiceProvider extends ServiceProvider
{
    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }

    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        JetstrapFacade::useCoreUi3();
    }
}

AdminLTE

AdminLTE是一个开源的行政仪表板和控制面板主题。它建立在Bootstrap之上,AdminLTE提供了一系列响应式、可重用和常用的组件。

请访问AdminLTE的文档以获取更多关于如何使用的详细信息。

要使用AdminLte预设,只需在您的AppServiceProvider中调用useAdminLte3方法。

<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use MadeITBelgium\Jetstrap\JetstrapFacade;

class AppServiceProvider extends ServiceProvider
{
    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }

    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        JetstrapFacade::useAdminLte3();
    }
}

Breeze

警告!!!:Jetstrap资源已更新以与当前版本的Breeze兼容,但不支持交换inertia-react资源。如果您能提供此功能,请随意提交PR。

根据文档,“Breeze为构建具有认证的Laravel应用程序提供了一个最小和简单的起点。”但就我个人而言,我更愿意将其视为没有Vue和Bootstrap的Laravel Ui。最近,我参与了一个不使用Vue且不需要复杂认证系统的项目,所以Breeze看起来是个不错的选择,但我再次遇到了TailwindCSS的问题,所以我想为什么不将其包含在Jetstrap包中。

在继续之前,请通过官方文档文档熟悉Breeze。

同样,Jetstrap不会影响Breeze的模型/控制器部分,只影响视图。

交换 Breeze 资源

要在配置了Breeze的Laravel中交换Tailwind资源为Bootstrap,只需运行

php artisan jetstrap:swap breeze

交换 Breeze inertia 资源

Laravel Breeze现在包含用于inertia脚手架的占位符,Jetstrap也是如此。要为在Breeze和inertia上运行的laravel项目使用Bootstrap脚手架,请运行以下代码

php artisan jetstrap:swap breeze-inertia

接下来,您需要清理您的package.json文件,确保我们不会安装不必要的包。

之后运行

npm install && npm run dev

...然后您就完成了!

在交换breeze资源时,在您的服务提供商中使用JetstrapFacade::useCoreUi3()JetstrapFacade::useAdminLte3();将按预期工作。

测试

使用以下命令运行测试

vendor/bin/phpunit

composer tests

许可证

Jetstrap是开源软件,采用MIT许可