学无先后，达者为师

网站首页编程语言正文

webpack-插件: plugin的使用（clean-webpack-plugin）

作者：小强有个dream 更新时间： 2022-04-04 编程语言

clean-webpack-plugin

每次打包清空打包目录
NOTE: Node v10+ and webpack v4+ are supported and tested.

const { CleanWebpackPlugin } = require('clean-webpack-plugin');

module.exports = {
    plugins: [
        new CleanWebpackPlugin()
    ],
};

html-webpack-plugin

Plugin that simplifies creation of HTML files to serve your bundles 自动为我们打包后目录生成index.html并引起js入口文件

const webpack = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')

plugins: [
    new HtmlWebpackPlugin({
      template: './public/index.html' // 自定义模板进行覆盖（webpack会对比两个index.html模板文件，保留更改的部分）
    }),
    new webpack.DefinePlugin({ // webpack内置插件，可以定义常量
      BASEURL: '"./"' 
    })
  ]

/ public/index.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>vue</title>
  <link rel="icon" href="<%= BASEURL =>favicon.ico">
</head>
<body>
  <div id="app"></div>
</body>
</html>

原文链接：https://blog.csdn.net/qq_36413371/article/details/121307042

上一篇：git: git commit时出现 -modified c
下一篇：webpack-loader: loader的使用（图片、t

相关推荐

2022-07-02 C语言由浅入深讲解线程的定义_C 语言
2023-07-13 react中useState的基本用法
2022-07-19 react表单处理之非受控组件
2023-02-03 Linux设置每晚定时备份Oracle数据表的操作命令_linux shell
2022-03-19 nginx rtmp模块编译 arm版本的问题_nginx
2022-12-11 Go map发生内存泄漏解决方法_Golang
2022-10-26 Golang 手写一个简单的并发任务 manager_Golang
2022-02-24 开机时自动运行批处理

栏目分类

最近更新