gulp理论
新建项目
npm init -y
安装gulp
yarn add gulp -D
添加启动build
npx gulp --version 查看gulp版本
新建gulpfile.js
// 压缩js uglifyjs
function js () {
console.log('js')
}
// 对scss less编译 压缩 输出css文件
function css () {
console.log('css')
}
// 监听这些文件的变化
function watcher() {
console.log('watcher')
}
exports.scripts =js
exports.watcher =watcher
exports.styles =css
exports.default =function(){
console.log('hello gulp')
}
配置并运行
※ npx gulp --tasks
查看所有当前的任务
npx gulp scripts 执行这个 task
准备安装gulp插件
yarn add gulp-sass gulp-autoprefixer gulp-load-plugins gulp-uglify dev -D
注意安装中如果报错
以（管理员）！！！！！！的身份运行以下命令
cnpm install --global --production windows-build-tools
管理员！！！
出现pythonxxxxxx 错误可在以上部分解决
重新运行
执行npx gulp xxx时
卡在.......................checking installable status
npm config set registry https://registry.npm.taobao.org
npm config get registry 查看源
再次执行 安装 加速！！！！
根据上述配置
npm install
css 样式配置
browsersync 页面热刷新
https://www.browsersync.io/docs/gulp
配置
yarn add browser-sync -D
优于
1st
网友评论