安装webpack
管理员模式进入cmd
输入
npm install webpack -g 等待下载。
下载完毕输入
npm install webpack-cli -g 等待下载。
下载完毕输入
webpack -v
webpack-cli -v检查版本号,安装成功。
使用webpack
1.创建文件夹webpack-stduy
2.使用idea打开此文件夹
3.创建modules类似于java包,并在其中创建hello.js与和main.js
main.js
//导入hello.js,相当于java类。
var hello = require("./hello");
//执行hello.js中的方法
hello.sayHi();
hello.js
//暴露一个方法,
exports.sayHi = function () {
document.write("<h1>ES6</h1>")
}
4.在module的同级目录下创建webpack.config.js
module.exports = {
entry:'./modules/main.js',//程序执行的入口
output:{
filename:"./js/bundle.js"//程序打包的位置
}
}
5.执行打包命令
【1】.在idea的Terminal中输入webpack命令。
【2】.在cmd中,进入当前项目输入webpack命令
6.验证
创建index.html,将打包好的js导入到当前页面中,运行即可。
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src="dist/js/bundle.js"></script>
</body>
</html>