基于流的自动构建工具——gulp

梦里梦外; 2021-07-25 12:41 353阅读 0赞

# 打包时出现错误： ![打包出现错误][20200407143657745.png] #

**问题原因：** 由于gulp版本的升级对于任务的参数有所变化。  
**解决方案：** gulp配置的task任务中第二个参数是非函数的 外侧包裹一层`gulp.series()`方法或者`gulp.parallel()`方法

例如：如果默认任务是 `gulp..task(‘default’, [‘html’])`这样的 改成  
`gulp.task(“default”, gulp.series(“html”))`或者 `gulp.task(“default”, gulp.parallel(“html”))`或者![在这里插入图片描述][20200407143855619.png]

# 修改文件后实时打包的功能只能执行一次 #

**问题原因：** 由于gulp版本升级对于监听有所修改。  
**解决方案：** 需要在每个任务处理函数里面添加返回值，返回值为当前任务的打包规则  
例如：  
原本的server任务配置：

gulp.task(“server”, function () { 
    	connect.server({ 
    port: 9999 
    		livereload: true
    })
    });

改成：

gulp.task(“server”, function () { 
    	return connect.server({ 
    port: 9999 
    		livereload: true
    })
    });

# 已经打包出目录没有打包文件 #

**问题原因：** 没有配置打包后的文件名称  
**解决方案：** 在配置打包路径后加上文件名称  
例如：原配置如下：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llaGFvY2hlbmc1MjA_size_16_color_FFFFFF_t_70]  
应该修改为：  
![在这里插入图片描述][20200407144046931.png]

[20200407143657745.png]: https://img-blog.csdnimg.cn/20200407143657745.png
[20200407143855619.png]: /images/20210725/f01f82e7ce1a424ba6b10045135a07d7.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llaGFvY2hlbmc1MjA_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200407144038457.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3llaGFvY2hlbmc1MjA=,size_16,color_FFFFFF,t_70
[20200407144046931.png]: https://img-blog.csdnimg.cn/20200407144046931.png