1.全局安装webpack:

npm install -g webpack

2.在项目里面创建配置项

npm init

3.在项目中安装webpack的依赖项

npm install --save-dex webpack


4.创建多个目录


-app   存放js文件
---main.js   入口文件,在页面中引用
---work.js   应用文件
-public   公共文件
---index.html   首页


5.编写文件


//在main.js中引入work.js
require('./work.js');
//在work.js中写入
console.log('hello word');
//在index.html中引入文件
<script src="./webpack.js"></script>

6.编译

//进入项目目录,运行命令
webpack js目录 输出的目录
webpack app/main.js public/webpack.js
//如果出现Do you want to install 'webpack-cli' (yes/no)请执行一下命令
npm install webpack-cli -g
//如果再次出错说没找到模块行加上-o在执行就可以了
webpack app/main.js -o public/webpack.js

成功后会生成webpack.js

运行结果

标签: 前端, Webpack

添加新评论