[英]Elixir + Gulp + Laravel with differents JS inclusions depending on URL
我想開始使用Elixir + Gulp。 在我的項目中,我只使用CSS + JS。
今天,我這樣使用它:在所有文件中都包含一個dashboard.blade.php。
然后,根據頁面的不同,我為每個庫提供了一個條件包含:
@if (Request::is("tournaments") || Request::is("invites"))
{!! Html::script('js/plugins/tables/footable/footable.min.js') !!}
@endif
@if (Request::is("tournaments/create"))
{!! Html::script('js/plugins/forms/inputs/duallistbox.min.js') !!}
{!! Html::script('js/plugins/pickers/pickadate/picker.js') !!}
{!! Html::script('js/plugins/pickers/pickadate/picker.date.js') !!}
@endif
....
我想要的是使用長生不老葯,並在長生不老葯方面進行此操作,因此我可以簡化我的dashboard.blade.php,並且始終只有兩個包含:app.css和app.js
我只是不知道什么是最好的方法。
任何想法?
編輯1:
在gulp.js中,我定義了所有頁面通用的通用樣式:
mix.styles([
'icons/icomoon/styles.css',
'bootstrap.css',
'components.css',
'colors.css'
],'public / css / app.css');
然后,在我的頁面中添加如下內容:
{!! Html::style('css/app.css')!!}
我可以在Chrome中打開文件,因此鏈接似乎正常。
但是,當我打開自己的網站時,一切都出了問題,而且我在Chrome控制台中遇到了問題:
Uncaught SyntaxError: Unexpected token <
jquery.min.js:1 Uncaught SyntaxError: Unexpected token <
bootstrap.min.js:1 Uncaught SyntaxError: Unexpected token <
blockui.min.js:1 Uncaught SyntaxError: Unexpected token <
app.js:1 Uncaught SyntaxError: Unexpected token <
pnotify.min.js:1 Uncaught SyntaxError: Unexpected token <
switch.min.js:1 Uncaught SyntaxError: Unexpected token <
(index):1 Failed to decode downloaded font: http://laravel.dev/css/fonts/icomoon.woff?3p0rtw
(index):1 OTS parsing error: invalid version tag
(index):1 Failed to decode downloaded font: http://laravel.dev/css/fonts/icomoon.ttf?3p0rtw
(index):1 OTS parsing error: invalid version tag
我做錯了什么???
在您的gulpfile.js
您可以創建一個大型腳本,例如:
/**
* Tournaments create package
*/
mix.scripts([
'forms/inputs/dualistbox.min.js',
'pickers/pickadate/picker.js',
'pickers/pickadate/picker.date.js'
// ↑ these are the files you are wanting to merge
], 'js/directory/where/you/want/script/saved/tournamentCreate.js', 'js/plugins');
// ↑ this is directory you want the merged file to be in ↑ this is the directory to look in for the scripts above
/**
* Version control (might use, might not...I do)
*/
mix.version([
'js/directory/from/above/tournamentCreate.js'
]);
現在,您已經包含了包含腳本的合並腳本,您可以使用elixir
將其拉入。請注意,您需要在控制台中運行gulp
才能創建文件。
在你的tournementcreate.blade.php中
@section('scripts')
<script src="{{ elixir('js/directory/from/above/tournamentCreate.js') }}"></script>
@endsection
您可以創建任意數量的內容。 您只需使用具有相同布局的新mix.scripts()
。 希望這一切都有道理!
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.