1、webpack是流行的资源打包工具,属于前端workflow(工作流)的一部分。
简单说,它牛逼的地方就是把一切静态资源打包在一个文件,并且有一堆的插件。
2、安装webpack
把webpack安装到项目依赖
npm install webpack --save-dev 安装到项目。
3、webpack要工作,依赖于一个webpack.config.js的配置文件。
module.exports={ //node.js的模块输出标准格式
entry: './main.js', //entry是入口文件,是程序的入口文件的相对地址
output: { //打包后输出的文件
filename: 'bundle.js' //输出的文件叫做bundle.js
}
};
4、命令行执行webpack
调用全局安装的webpack工具对资源进行打包,最后输出或创建bundle.js文件
5、index.html script src = bundle.js
网页最后调用的是打包后的文件
6、入口文件的数量有多个
//node.js的模块输出标准格式
module.exports = {
//entry是入口文件,是程序的入口文件的相对地址
entry: {
bundle1: './main1.js',
bundle2: './main2.js'
},
//打包后输出的文件
output: {
filename: '[name].js'
}
//输出的文件叫做bundle.js
};
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。