vue脚手架使用 html-webpack-plugin插件

vue脚手架使用 html-webpack-plugin插件

插件的作用

1、会在内存中生成一个html，也是在根目录
2、自动引入内存中的打包的js文件

在根目录创建config.vue.js文件

module.exports = {
  chainWebpack: config => {
  // 判断为 发布阶段 设置入口文件为 main-prod.js
    // config.when() 类似于 if()
    config.when(process.env.NODE_ENV === 'production', config => {
      config.entry('app').clear().add('./src/main-prod.js')

      //使用externals设置排除项
      config.set('externals',{
        vue: 'Vue',
        'vue-router': 'VueRouter',
        axios: 'axios',
        echarts: 'echarts',
        nprogress: 'NProgress',
        'vue-quill-editor': 'VueQuillEditor'
      })
        // 使用配置 html-webpack-plugin 插件 生成发布html入口
        config.plugin('html').tap(args => {
          // 添加参数isProd
          arg