laravel 使用 vue （gulp）

1）首先要安裝 gulp

看這里 http://www.cnblogs.com/tujia/p/6397779.html 

 

2）編輯js

默認 laravel 里有一個 /resources/assets/js/app.js  這個 gulp 要編譯文件，gulp 將 /resources/assets/js/app.js 編譯成 /public/js/app.js 文件，/public/js/app.js 在公共底部被引用

 

雖然 /resources/assets/js 里只有一個 app.js，但不代表你只能寫一個 js，你可以寫自己的js，再用 larave-exlixir 工具合並成一個 js 

elixir(function(mix) {
    mix.scripts([
        'order.js',
        'forum.js'
    ]);
});

PS:默認保存在 /public/js/all.js 里，當然也可以自己改保存路徑

elixir(function(mix) {
    mix.scripts(['app.js', 'controllers.js'], 'public/js/app.js')
       .scripts(['forum.js', 'threads.js'], 'public/js/forum.js');
});

如果你還想懶一點，可以直接給一個js目錄就可以打包了（默認保存在 /public/js/all.js 里）

elixir(function(mix) {
    mix.scriptsIn('public/js/some/directory');
});

 

3）應用 js 

終端運行 gulp 命令就可以編譯打包 js 了

gulp

如果你想壓縮 js，可以加上 --product 參數

gulp --product

 

4）debug 模型

在開發階段，如果你覺得每次修改后都要執行 gulp 命令比較麻煩，那你可以使用下面這個偵聽命令

gulp watch

它會偵聽項目里的文件變化，如果文件發生的修改就會自動編譯了，不需要重復執行 gulp 命令

 

5）溫馨提示

laravel 公共模版里引用 app.js 沒加版本號，app.js 會被瀏覽器緩存了，所以有時候你刷新可能會看不到變化，你可以加一個時間戳（測試的時候，正式環境建議在后台加一個“版本號”配置）

<script src="/js/app.js?{{rand()}}"></script>

<script src="/js/app.js?{{$app_version}}"></script>

 

---

 

完