//这段代码主要用于根据不同的环境（生产环境或开发环境）来配置webpack的入口文件和外部依赖
//（externals）。在生产环境中，通过externals配置来告诉webpack不要将这些指定的库打包到最终的
//bundle中，因为它们将在运行时通过全局变量来访问。同时，它还修改了html-webpack-plugin插件的
//配置，通过添加一个isProd标志来区分当前是生产环境还是开发环境，这可以在生成的HTML文件中被用
//来进行条件渲染或其他逻辑处理。
// 导出webpack配置修改函数
module.exports = {
  // 使用chainWebpack来自定义webpack配置
  chainWebpack: config => {
    // 判断当前是否为生产环境
    config.when(process.env.NODE_ENV === 'production', config => {
      // 修改入口文件为src/main-prod.js（用于生产环境）
      config
        .entry('app') // 获取名为'app'的入口配置
        .clear() // 清除原有的入口文件
        .add('./src/main-prod.js') // 添加新的入口文件

      // 设置externals，这些库在打包时将不会被包含，而是作为外部依赖在运行时引入
      config.set('externals', {
        vue: 'Vue', // Vue库在运行时通过全局变量Vue访问
        'vue-router': 'VueRouter', // vue-router库在运行时通过全局变量VueRouter访问
        axios: 'axios', // axios库在运行时通过全局变量axios访问
        lodash: '_', // lodash库在运行时通过全局变量_访问
        echarts: 'echarts', // echarts库在运行时通过全局变量echarts访问
        nprogress: 'NProgress', // nprogress库在运行时通过全局变量NProgress访问
        'vue-quill-editor': 'VueQuillEditor' // vue-quill-editor库在运行时通过全局变量VueQuillEditor访问
      })

      // 修改html-webpack-plugin插件的配置，设置isProd标志为true
      config.plugin('html').tap(args => {
        args[0].isProd = true // 修改html-webpack-plugin的第一个参数对象，添加isProd属性并设为true
        return args // 返回修改后的参数数组
      })
    })

    // 判断当前是否为开发环境
    config.when(process.env.NODE_ENV === 'development', config => {
      // 修改入口文件为src/main-dev.js（用于开发环境）
      config
        .entry('app') // 获取名为'app'的入口配置
        .clear() // 清除原有的入口文件
        .add('./src/main-dev.js') // 添加新的入口文件

      // 修改html-webpack-plugin插件的配置，设置isProd标志为false
      config.plugin('html').tap(args => {
        args[0].isProd = false // 修改html-webpack-plugin的第一个参数对象，添加isProd属性并设为false
        return args // 返回修改后的参数数组
      })
    })
  }
}