一、环境搭建
开发工具:VS Code(自行下载)
安装Node:http://nodejs.cn/
安装webpack
全局安装
npm install webpack webpack-cli webpack-dev-server -g
注意:从webpack4开始,webpack-cli需要独立安装。
二、项目实战
1、建立一个空文件夹,比如叫webpack_demo
执行命令
npm init -y
得到package.json
2、安装webpack
npm i webpack -s -d
npm install webpack-cli
3、建立目录结构
创建文件夹 dist src
mkdir dist src
为了方便测试,建立entrey.js index.html bundle.js等文件
4、打包命令
webpack src/entery.js -o dist/bundle.js --mode development
5.访问index.html页面效果如下
注意
由于webpack4版本升级,导致之前的命令
webpack src/entery.js dist/bundle.js
无法正常使用
请使用
webpack src/entery.js -o dist/bundle.js --mode development
源码:https://gitee.com/andli/webpack_demo.git
参考文档
https://www.cnblogs.com/ldq678/p/10295870.html