kuailelunwen_new_houtai/vue.config.js

// const path = require('path');
// const TerserPlugin = require('terser-webpack-plugin');
// const webpack = require('webpack')
// module.exports = {
//   // publicPath: '/new/',
//   devServer: {
//     proxy: {
//       '/supernew': {
//         target: 'http://adminnew.pengda.checkcopy.com/',
//         changeOrigin: true,
//       },
//       '/agentnew': {
//         target: 'http://adminnew.pengda.checkcopy.com/',
//         changeOrigin: true,
//       }
//     }
//   },
//   configureWebpack: {
//     plugins: [
//       new webpack.DefinePlugin({
//         'process.env.VUE_APP_TYPE': JSON.stringify(process.env.VUE_APP_TYPE || 'client'),
//       }),
//     ],
//     module: {
//       rules: [
//         {
//           test: /\.js$/,
//           exclude: /node_modules/,
//           use: {
//             loader: 'babel-loader',
//           },
//         },
//         {
//           test: /(client|admin)-routes\.json$/, // 匹配路由文件
//           use: [
//             {
//               loader: 'file-loader',
//               options: {
//                 name: '[name].[ext]',
//                 outputPath: 'router/', // 输出到 dist/router/
//               },
//             },
//           ],
//         },
//       ]
//     },
//     // chainWebpack:config => {
//       // 根据模式排除不需要的视图组件
//       // const mode = process.env.VUE_APP_TYPE
//       // config.plugin('ignore')
//       // .use(require('webpack').IgnorePlugin, [
//       //   new RegExp(`src/views/${mode === 'client' ? 'mode2' : 'mode1'}`)
//       // ])
//     // },
//     // chainWebpack: config => {
//     //   // 根据环境变量解析路由文件
//     //   config.resolve.alias.set(
//     //     '@active-router',
//     //     path.resolve(__dirname, `src/router/${process.env.VUE_APP_TYPE || 'admin'}-routes.json`)
//     //   )
      
//     //   // 确保只打包当前模式需要的路由文件
//     //   config.plugin('define').tap(definitions => {
//     //     definitions[0]['process.env'].VUE_APP_TYPE = 
//     //       JSON.stringify(process.env.VUE_APP_TYPE)
//     //     return definitions
//     //   })
//     // },
//      // plugins: [
//       // new webpack.DefinePlugin({
//       //   'process.env.ROUTES_FILE': JSON.stringify(
//       //     process.env.VUE_APP_TYPE === 'client' 
//       //       ? 'client-routes.json' 
//       //       : 'admin-routes.json'
//       //   )
//       // })
//     // ],
//     optimization: {
//       minimizer: [
//         new TerserPlugin({
//           terserOptions: {
//             format: {
//               comments: /^\**!|@preserve|@license|@cc_on/i // 保留特定注释
//             }
//           },
//           extractComments: false // 不提取注释到单独文件
//         })
//       ],
//       splitChunks: {
//         cacheGroups: {
//           // 为每套路由创建单独的chunk
//           mode1Routes: {
//             test: /[\\/]router[\\/]mode1[\\/]/,
//             name: 'mode1-routes',
//             chunks: 'all',
//             enforce: true
//           },
//           mode2Routes: {
//             test: /[\\/]router[\\/]mode2[\\/]/,
//             name: 'mode2-routes',
//             chunks: 'all',
//             enforce: true
//           }
//         }
//       }
//     },
//     output: {
//       filename: '[name].[contenthash:8].js',
//       chunkFilename: '[name].[contenthash:8].js'
//     },
//     resolve:{
//       alias:{
//         '@':path.resolve(__dirname, 'src/')
//       }
//     }
//   },
// };

const path = require('path');
const TerserPlugin = require('terser-webpack-plugin');
const webpack = require('webpack');

// 获取当前构建类型（admin或client），默认为admin
const currentType = process.env.VUE_APP_TYPE || 'admin';

module.exports = {
  // 基本路径
  publicPath: process.env.NODE_ENV === 'production' ? '/' : '/',
  
  // 开发服务器配置
  devServer: {
    proxy: {
      '/supernew': {
        target: 'http://adminnew.pengda.checkcopy.com/',
        changeOrigin: true,
      },
      '/agentnew': {
        target: 'http://adminnew.pengda.checkcopy.com/',
        changeOrigin: true,
      }
    }
  },
  
  // 页面配置 - 关键修改点
  // pages: {
  //   admin: {
  //     entry: 'src/admin-main.js',
  //     template: 'public/index.html',
  //     filename: 'index.html',
  //     // 根据环境排除不需要的chunks
  //     chunks: ['chunk-vendors', 'chunk-common', 'admin']
  //   }
  // },
  
  // 配置Webpack
  configureWebpack: {
    plugins:  [
      new webpack.DefinePlugin({
        'process.env.VUE_APP_TYPE': JSON.stringify(currentType),
      }),
      // 使用IgnorePlugin排除不需要的页面
      new webpack.IgnorePlugin({
        checkResource(resource) {
          const isAdminBuild = currentType === 'admin';
          const isClientBuild = currentType === 'client';
          
          // 构建admin时排除client页面
          if (isAdminBuild && resource.includes('/src/views/agent/')) {
            console.log('Excluding client resource:', resource);
            return true;
          }
          
          // 构建client时排除admin页面
          if (isClientBuild && resource.includes('/src/views/super/')) {
            console.log('Excluding admin resource:', resource);
            return true;
          }
          
          return false;
        }
      })
    ],
    module: {
      rules: [
        {
          test: /\.js$/,
          exclude: /node_modules/,
          use: {
            loader: 'babel-loader',
          },
        },
         // 添加SCSS规则
         {
          test: /\.scss$/,
          use: [
            {
              loader: 'sass-loader',
              options: {
                implementation: require('sass'),
                sassOptions: {
                  indentedSyntax: false
                }
              }
            }
          ]
        }
      ]
    },
    optimization: {
      minimizer: [
        new TerserPlugin({
          terserOptions: {
            format: {
              comments: /^\**!|@preserve|@license|@cc_on/i // 保留特定注释
            }
          },
          extractComments: false // 不提取注释到单独文件
        })
      ],
      splitChunks: {
        cacheGroups: {
          // 公共代码提取
          vendor: {
            test: /[\\/]node_modules[\\/]/,
            name: 'chunk-vendors',
            chunks: 'all',
            priority: 10
          },
          common: {
            name: 'chunk-common',
            minChunks: 2,
            chunks: 'initial',
            priority: 5,
            reuseExistingChunk: true
          }
        }
      }
    },
    output: {
      filename: '[name].[contenthash:8].js',
      chunkFilename: '[name].[contenthash:8].js'
    },
    resolve:{
      alias:{
        '@':path.resolve(__dirname, 'src/')
      }
    }
  },
  
  // 链式操作 - 更精确地控制打包内容
  // chainWebpack: config => {
  //   // 根据构建类型排除不需要的页面
  //   if (currentType === 'admin') {
  //     // 排除client页面
  //     config.plugin('ignore')
  //       .use(webpack.IgnorePlugin, [{
  //         resourceRegExp: /^\.\/client-pages$/,
  //         contextRegExp: /src[\\/]views/
  //       }]);
  //   } else if (currentType === 'client') {
  //     // 排除admin页面
  //     config.plugin('ignore')
  //       .use(webpack.IgnorePlugin, [{
  //         resourceRegExp: /^\.\/admin-pages$/,
  //         contextRegExp: /src[\\/]views/
  //       }]);
  //   }
    
  //   // 确保只打包当前模式需要的路由文件
  //   config.resolve.alias.set(
  //     '@active-router',
  //     path.resolve(__dirname, `src/router/${currentType}-routes.json`)
  //   );
  //   config.plugin('webpack-bundle-analyzer')
  //   .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin);
  // }
   // 链式操作
   chainWebpack: config => {
    // 根据构建类型设置路由文件别名
    config.resolve.alias.set(
      '@active-router',
      path.resolve(__dirname, `src/router/${currentType}-routes.json`)
    );
    // config.resolve.alias.delete('@active-router');
    
    // 生产环境下添加打包分析
    if (process.env.NODE_ENV === 'production') {
      config.plugin('webpack-bundle-analyzer')
        .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin, [{
          analyzerMode: 'disabled', // 默认禁用，可通过--report参数启用
          generateStatsFile: true
        }]);
    }
  }
};