webpack发布

110 阅读1分钟

当我们项目开发完成后,需要发布上线,而我们通过webpack-dev-server的插件打包的文件是存在于内存上的,物理磁盘上并不存在,所以我们需要将内存中的项目复制一份到物理磁盘上。

方法:在package.json文件中的scripts中添加以下代码:

"bulid":"webpack --mode production"

然后在终端中运行:

npm run build

注意:我们在项目开发阶段运行的是:npm run dev,这个只能将项目打包在内存中;当项目完成时,需要发布时,我们就运行npm run build

运行完成后就可以在项目根目录中发现新建了一个dist的文件夹,这个时候就代表打包完成了;

然而这样打包也会有一个问题,就是如果再次修改了项目代码,我们再次打包时就得将存在在根目录中的dist文件先删除掉,才能获得最新的文件,所以我们最好先安装一个自动清除的插件

clean-webpack-plugin插件

使用:①安装,在终端中运行以下代码:

npm install --save-dev clean-webpack-plugin

②使用:在webpack.config.js文件中添加以下代码:

const { CleanWebpackPlugin } = require('clean-webpack-plugin');
module.exports = {
  mode: "development",
  plugins:[CleanWebpackPlugin]}

然后就可以在每次打包前清除dist文件了