1.webpack主要用来模块和打包
2.webpack和gulp对比:
什么时候用gulp
a.如果你的工程模块依赖非常简单,甚至是没有用到模块化的概念
b.只需要进行简单的合并、压缩,就使用grunt/gulp即可
不同点:
grunt/gulp更加强调的是前端流程的自动化,模块化不是它的核心
webpack更加强调模块化开发管理,而文件压缩合并、预处理等功能,是他附带的功能
webpack安装使用:
安装node webpack
--save-dev`是开发时依赖,项目打包后不需要继续使用的
1.如何打包:
vscode的powershell终端打开:ctrl+`
webpack src/main.js dist/bundle.js
简化上述命令:创建一个webpack.config.js文件创建入口和出口
将node_modules/.bin/webpack 改成 npm run build :
可以在package.json的scripts中定义自己的执行脚本: "script":{"build": "webpack"}
loader:
将ES6转成ES5代码,将TypeScript转成ES5代码,将scss、less转成css,将.jsx、.vue文件转成js文件等等
使用:
1.通过npm安装,2.在webpack.config.js中的modules关键字下进行配置