全局安装webpack（在cmd中类似安装vue-cli）
# 安装
cnpm install webpack -g
cnpm install webpack-cli -g
# 测试
webpack -v
webpack-cli -v
新建一个目录结构
hello.js
// 暴露一个方法
exports.sayHi1 = function(){
document.write("<h1>Hello, World--------1!</h1>")
};
// 暴露第二个方法
exports.sayHi2 = function(){
document.write("<h1>Hello, World--------2!</h1>")
};
// 暴露第三个方法
exports.sayHi3 = function(){
document.write("<h1>Hello, World--------3!</h1>")
};
main.js
// 接入一个文件，这样就可调用它暴露的方法：./表示当前目录
var hello = require("./hello");
hello.sayHi1();
在项目目录下新建webpack.config.js
// 打包配置
module.exports = {
entry: './modules/main.js', // 程序入口
output: {
filename: './js/bundle.js' // 输出位置
}
};
运行测试webpack，发现多出一个文件夹dist
创建index.html，将js引入
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src="dist/js/bundle.js"></script>
</body>
</html>
浏览器打开
