Webpack是一个模块打包器。每一个应用可能包含多个JS文件,JS文件之间又有依赖关系。JS文件的加载需按一定的顺序。Webpack 读取和分析入口文件和他的所有依赖,将入口文件和他的所有依赖的文件打包成一个可以识别的JS文件。
1、用NPM 发装WebPack
命令: npm install --save-dev webpack,在项目目录安装webpack,并修改了NPM 的配置文件package.json
2、使用方法
webpack 入口文件 打包后的文件。
如 a.js 依赖b.js , 用webpack 打包后生成 bundle.js文件。命令 webpack a.js bundle.js
webpack会将a.js 和 b.js 一并打包到bundle.js.
3、配置文件webpack.config.js
4、loader
webpack本身只支持JS模块,但可以通过各种loader来处理各种格式的文件。如Type Script,JSON等格式的文件转换成JS格式,一并打包。
配置文件:
5、Plugins
插件(Plugins)是用来拓展Webpack功能。如HtmlWebpackPlugin,用于生成HTML5文件。
a)安装:npm install --save-dev html-webpack-plugin
b)修改webpack.config.js配置
plugins: [ new HtmlWebpackPlugin({ template:‘src/index.html’}) ]