p3ym4n/laravel-asset-manager

基于Bower的laravel 5资产管理器

此包的规范存储库似乎已消失,因此已冻结此包。

1.1.3 2017-01-31 12:54 UTC

This package is auto-updated.

Last update: 2020-04-21 14:31:34 UTC


README

安装

使用以下命令使用composer安装此包

composer require p3ym4n/laravel-asset-manager

更新composer后,将服务提供者添加到config/app.php文件中的providers数组

p3ym4n\AssetManager\AssetServiceProvider::class,

并将外观添加到config/app.php文件中的aliases数组

'Asset' => p3ym4n\AssetManager\Facades\Asset::class,

然后初始化bower(如果你想的话),默认情况下,资产将复制到项目根目录中的bower_components文件夹。

您还可以发布配置文件以更改默认值(bower_dir & public_cache_folder)。

php artisan vendor:publish --provider="p3ym4n\AssetManager\AssetServiceProvider" --tag=config

控制台命令

添加包后,您将拥有2个新命令

1. 在App\Http\Assets命名空间下创建新的资产文件

php artisan asset:make bootstrap

在这里,bootstrap将成为包的名称,并生成app/Http/Assets/BootstrapAsset.php文件。

在生成的类中,只有一个名为init的方法,在其中您应定义从bower_dir相对于包文件夹的基路径以及您的资产或公共目录中文件夹的绝对路径。请参见以下示例

final class BootstrapAsset extends BaseAsset

    protected function init()
    {
        $this->baseDir = '/bootstrap-rtl/dist/';

        $this->css = [          // you can use * for all files
            'css/*.min.css'     
        ];

        $this->js = [
            'js/bootstrap.min.js'
        ];

        $this->include = [      // also you can include some other files that needed in the package
            'fonts/*'           
        ];

                                
        $this->script =         // you can write your own custom initializations or other stuff... 
        "       
            $(function(){
                $('[data-toggle=\"tooltip\"]').tooltip({
                    container : 'body'
                });

                $('[data-toggle=\"popover\"]').popover({
                    container : 'body'
                });
            });
        ";
        
        $this->style =          // also you can add your custom styles & css 
        "        
            body{
                font-size: 14px;
            }
        ";
    }
}

您可以使用五个属性进行初始化:cssjsincludescriptstyle。如您在示例中看到的那样,cssjsinclude的值是从$this->baseDir的文件路径。否则,scriptstyle包含内联javascript和css。

2. 清除public_cache_folder

有时您可能想要清除缓存文件夹。

php artisan asset:clear

如何使用包

通过调用将包添加到您的控制器或提供者(引导方法)中

BootstrapAsset::add();

或通过调用删除包

BootstrapAsset::del();

资产持有者

在这个包中,我们还有一个资产持有者(Asset外观),它有这些方法

Asset::addCss("path/to/css/file");
Asset::delCss("path/to/css/file");

Asset::addJs("path/to/js/file");
Asset::delJs("path/to/js/file");

Asset::addStyle(" some css ... ");
Asset::delStyle(" some css ... ");

Asset::addScript(" some js ... ");
Asset::delScript(" some js ... ");

要附加到视图中的资产最终列表

添加和修改后,您可以使用以下命令获取资产作为array,所有定义的文件将自动复制到缓存文件夹,文件的url可以通过以下调用访问。

Asset::get('css');          //returns an array       

Asset::get('js');           //returns an array

Asset::get('style');        //returns a string
    
Asset::get('script');       //returns a string       

使用示例

在这里,我向您展示我是如何使用此包的。

在每一个项目中,我们都有一些默认的包,我们会在项目的所有页面中使用它们。因此,在 AppServiceProvider.php 的 boot 方法中添加它们是个好主意。看看我的例子:

public function boot()
{

    JqueryAsset::add();
    AjaxFormAsset::add();
    CookieAsset::add();
    BootstrapAsset::add();
    FontAwesomeAsset::add();
    SortableAsset::add();
    SpinAsset::add();   
    AppAsset::add();

    view()->composer('partials.css', function ($view) {
        $view->with([
            'allCss' => Asset::get('css'),
            'styles' => Asset::get('style'),
        ]);
    });

    view()->composer('partials.js', function ($view) {
        $view->with([
            'allJs'   => Asset::get('js'),
            'scripts' => Asset::get('script'),
        ]);
    });

}

我有两个 blade 模板用于包含我的 CSS 和 JS 文件。正如你在最近的代码块中看到的,当它们渲染时,我们会将结果作为 allCssstylesallJsscripts 变量发送。现在让我们看看这些模板。

// views/partials/css.blade.php

@if(isset($allCss) && !empty($allCss))
    <!-- Styles -->
    @foreach($allCss as $item)
        <link href="{{$item}}" rel="stylesheet">
    @endforeach
@endif

@if(isset($styles) && !empty($styles))
    <style>
        {!! $styles !!}
        @yield('style')
    </style>
@endif



// views/partials/js.blade.php
    
@if(isset($allJs) && !empty($allJs))
    <!-- JavaScripts -->
    @foreach($allJs as $item)
        <script src="{{$item}}"></script>
    @endforeach
@endif

@if(isset($scripts) && !empty($scripts))
    <script type="text/javascript">
        {!! $scripts !!}
        @yield('script')
    </script>
@endif

因此,你可以在你想要的地方包含你的 css.blade.phpjs.blade.php 模板。