这篇文章给大家分享的是有关laravel-mix如何自动压缩html模板文件的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

罗城网站建设公司创新互联,罗城网站设计制作,有大型网站制作公司丰富经验。已为罗城上1000家提供企业网站建设服务。企业网站搭建\成都外贸网站制作要多少钱,请找那个售后服务好的罗城做网站的公司定做!
安装依赖
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,即可实现自动监听压损模板文件,可以打开网页看到页面内的以及中的内容已经压缩了。打开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);
}
});感谢各位的阅读!关于“laravel-mix如何自动压缩html模板文件”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!
分享文章:laravel-mix如何自动压缩html模板文件
本文网址:http://www.jxjierui.cn/article/goocoi.html


咨询
建站咨询
