webpack 打包项目

在项目目录下新建两个文件夹 dist   src

在src目录下新建css img  js 三个文件夹 再 新建index.html main.js(JS入口文件)两个文件,此时页面结构webpack 打包项目

安装JQuery  输入:npm i jquery -S

安装完成后 会在页面目录中生成一个package.json的文件

再安装webpack 执行命令webpack .\src\main.js -o  .\dist\bundle.js --mode=development

说明:main.js要处理的文件,bundle.js输出的文件

此时就会打包好在dist目录下生成一个bundle.js的文件,引用该文件即可

注意:执行命令时提示webpack 不是内部命令时候,就是webpack的存放路径错了,还需在环境变量中添加

webpack 打包项目

webpack 打包项目

这时候就不会报webpack不存在了,如果执行提示model。。。警告无法生成bundle.js文件可能是指令输入错误