1. 要做操作的内容：
2. 首先用模块化的思想将需要使用的js模块暴露出来。
demo a.js
/*
* @Author: Robyn
* @Date: 2017-11-16 17:25:01
* @Last Modified by: Robyn
* @Last Modified time: 2017-11-16 17:25:01
*/
let a = 10,
b = 20;
module.exports = {
a : a,
b : b
};
demo b.js
/*
* @Author: Robyn
* @Date: 2017-11-16 17:25:44
* @Last Modified by: Robyn
* @Last Modified time: 2017-11-16 17:25:44
*/
module.exports = function (a,b) {
console.log(a + b);
}
3. 然后用main.js将需要使用的js引入进来
demo main.js
/*
* @Author: Robyn
* @Date: 2017-11-16 17:27:06
* @Last Modified by: Robyn
* @Last Modified time: 2017-11-16 17:27:06
*/
let obj = require('./a.js'),
fn = require('./b.js');
fn(obj.a,obj.b);
4. 以上做完以后，在全局安装一次webpack
npm i webpack -g
- 然后在要做操作的对应根目录下执行一次下面的代码：
npm i webpack -D
5. 将main.js打包成bundle.js
webpack main.js bundle.js
6. 然后在index.html手动引入bundle.js文件
7. 查看效果
8. 同时可以看到网络只请求了bundle.js，而没有请求其他js
