#之前講過從零開始部署一個Laravel 專案
這次講一下怎麼自動壓縮php模板檔案
安裝依賴
cd /var/www/html/laravel-project npm i -D laravel-mix@^5.x laravel-mix-template-minifier watch shelljs
壓縮處理
打開檔案webpack.mix.js
,並加入以下內容:
mix.minTemplate \= require("laravel-mix-template-minifier"); mix.minTemplate("storage/framework/views/\*.php", "storage/framework/views/", { collapseInlineTagWhitespace: true, collapseWhitespace: true, minifyCSS: true, minifyJS: true, processConditionalComments: true, removeAttributeQuotes: false, removeComments: true, removeTagWhitespace: false, trimCustomFragments: false, });
壓縮的參數,請參閱html-minifier(https://github.com/kangax/html-minifier?spm= a2c6h.14275010.0.0.70f559611yXtvP)
監聽檔案變更
在專案根目錄新建檔案compress.js
,寫入下列內容:
let shell = require("shelljs"); let watch = require("watch"); let precessing = false; watch.watchTree("./storage/framework/views", function(f, curr, prev) { if (!precessing) { precessing = true; shell.exec("npm run prod"); setTimeout(() => { precessing = false; }, 5000); } });
開機自啟動監聽命令
以上步驟完成後,在命令列執行node compress.js
,即可實現自動監聽壓損範本文件,可以開啟網頁看到頁面內的<style>
以及<script>
中的內容已經壓縮了。打開storage/framework/views/
中的模板文件,發現html已被壓縮成一行,如果模板中有包含php
程式碼,則不會移除php
中的換行等。
有些頁面的js
程式碼不會壓縮,暫時沒找到什麼原因。
由於監聽檔案指令是常駐命令台的,所以我們要設定開機自啟,並且後台啟動該指令。
nano /etc/rc.d/rc.local # 添加以下内容 cd /var/www/html/ysmj-laravel nohup node compress.js > /var/www/html/laravel-project/compress.out 2>&1 & # 保存文件。然后设置权限使其开机自启 chmod +x /etc/rc.d/rc.local
優化
由於laravel
自帶的package
命令npm run prod
中帶有--progress
,長期使用,會導致壓縮日誌compress.out
日益過大。
在package.json
中,新加入compress
指令,移除--progress
參數,如下:
"scripts": { "dev": "npm run development", "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "watch-poll": "npm run watch -- --watch-poll", "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js", "compress": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "prod": "npm run production", "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js" },
然後compress.js
檔案需要修改,如下:
let shell = require("shelljs"); let watch = require("watch"); let precessing = false; watch.watchTree("./storage/framework/views", function(f, curr, prev) { if (!precessing) { precessing = true; shell.exec("npm run compress"); setTimeout(() => { precessing = false; }, 5000); } });