laravel中使用gulp打包发布前端部分

laravel中的前端代码都是形如xxx.blade.php。可以使用前端的工具来对blade,css,js进行压缩吗?当然,gulp可以做到。

gulp是什么?

看完你就明白,这是个自动化构建工具的核心就是gulpfile.js。
用于laravel的gulp怎么写?
把一切****.html换成****.blade.php就行了。

有什么坑要注意?

  1. 异步执行,前后依赖关系必须写明。比如:
gulp.task('rev' , ['concatCss', 'concatJs'],function() {
    return gulp.src(['./rev/**/*.json', paths.html])   //- 读取 rev-manifest.json 文件以及需要进行css名替换的文件
        .pipe(revCollector(
            {
                replaceReved: true,
                dirReplacements: {
                    'css': 'css',
                    'js': 'js',
                }
            }
        ))                                
        .pipe(gulp.dest(dist));                 
});

这里先异步执行concatCss和concatJs两个task,然后执行dev。

  1. 在对css和js文件拼接md5后缀的时候,要按照官方文档的方式来写。

最后附上gulpfile.js的代码:

var gulp = require('gulp');
var uglify = require('gulp-uglify');
var rev = require('gulp-rev');
var revCollector = require('gulp-rev-collector');
var cleanCSS = require('gulp-clean-css');
var htmlmin = require('gulp-htmlmin');

var paths = {
    css: "css/*.css",
    js: "js/*.js",
    html: "./*.blade.php"
    
};
var dist = "./dist/";   //写的很简单,都发布到dist下。在laravel下可以配置不同文件类型的发布路径。

gulp.task('compressHtml',['rev'],function () {
    var options = {
        removeComments: true,//清除HTML注释
        removeScriptTypeAttributes: true,//删除`
                    
                    

你可能感兴趣的:(laravel中使用gulp打包发布前端部分)