本文是以webpack4.x做的记录
基本的打包操作:
步骤一:
mkdir demo // 在当前目录下创建一个文件夹 名字是:demo
cd demo // 从当前目录下进入到demo文件中去
npm init -y // -y跳过提问环节,直接生成一个 package.json文件
步骤二:
安装 webpack 和webpack-cli
命令: npm install webpack webpack-cli -D // 可以一起安装
或者分两次安装也是可以的
eg:
npm install webpack -D
npm install webpack-cli -D
完成了以上步骤就可以进行打包工作了。
注意:
webpack4.x的打包已经不能用
webpack 文件a 文件b
要用到以下命令:
1: webpack --mode development (未压缩版)
2: webpack --mode production(压缩版的)
webpack4.x中,打包的时候,默认情况下会将src下的入口文件(index.js)进行打包,
webpack会自动查找项目中src目录下的index.js文件,然后进行打包,生成一个dist目录并存在一个打包好的main.js文件
如果没有创建dist文件夹,打包之后会自动创建出dist文件夹和打包之后的main.js文件。
注意:如果没指定任何模式,默认是production模式
当然,我们一般会在package.json文件去做一些配置
npm run build 执行的就是 webpack --mode production
npm run dev 执行的就是 webpack --mode development
通常,我们还是会在webpack.config.js文件中去做 一些配置
执行打包命令:
产生的结果是:
此时项目文件下,就会产生一个aa的文件夹,并且有一个打包好的js文件:a.js文件
以上就是webpack4.x打包的基本操作,后续再总结。。。。