Node 第三方模块(Gulp)

第三方模块 Gulp

基于node平台开发的前端构建工具

将机械化操作编写成任务 ,想要执行机械化操作时执行一个命令行命令任务就能自动执行了

用机器代替手工,提高开发效率

Gulp 的作用

• 项目上线,HTML ,CSS JS文件压缩合并
• 语法转换 (es6 ,less ...)
• 公共文件抽离
• 修改文件浏览器自动刷新

Gulp使用

1.使用 npm install gulp 下载gulp 库文件

2.在项目根目录建立gulpfile.js文件

3.重构项目的文件夹结构src目录放置源代码文件dist目录放置构建后文件

4.在gulpfile.js文件中编写任务

Gulp 中提供的方法

• gulp.src () : 获取任务要处理的文件
• gulp.dest() : 输出文件
• gulp.task () 建立gulp文件
• gulp.watch() 监控文件的变化

Gulp插件

• gulp-htmlmin:html文件压缩
• gulp-csso:压缩css
• gulp-babel:JavaScript 语法转化
• gulp-less :less语法转化
• gulp-uglify : 压缩混淆JavaScript
• gulp-file-include 公共文件包含
• browsersync 浏览器实时同步

插件使用: 下载 ----引用-----调用

使用插件过程中出现的问题:

1.  webpack 无法加载文件 C:\Users\User\AppData\Roaming\npm\webpack.ps1，因为在此系统上禁止运行脚本。

解决方法:

2.ReferenceError: gulb is not defined

是为没保存 保存一下就可以了.

3.AssertionError [ERR_ASSERTION]: Task function must be specified

报错代码:

修改后: