webpack
webpack3和4的区别:
4是零配置的;
零配置会将你项目src目录下的index.js打包到dist文件夹的main.js当中。
webpack的作用:
- 优化:工程化。Vue,React cli
- 打包:将多个文件进行压缩,打包成一个文件。
- 转换:es6,ts,jsx,less,sass。
使用webpack:
安装
$npm i webpack -D
$npm i webpack -cli -D
就可以在命令行使用webpack命令;
webpack命令:
–mode 指定打包模式:开发development。生产production。默认是生产环境。
想将多个文件打包成一个文件:
webpack src/one.js src/two.js后面可选加上打包成什么模式
–output 指定导出文件地址
webpack src/one.js src/two.js --mode development --output hah.js
入口文件可以写成字符串,数组或者对象。
写成数组就打包到一起,写成对象会分片打包。
webpack-plugin:
html-webpack-plugin
webpack-dev-server
webpack-merge
rimraf
其他的打包工具:rollup,gulp,parcel
gulp:
gulp熟记五个命令:
- gulp.task - - 定义任务
- gulp.run - - 执行任务
- gulp.watch - - 监视任务
- gulp.src - - 设置根目录
- gulp.dest - - 设置生成文件的路径
再记一个pipe就够了。