const { defineConfig } = require('@vue/cli-service');
const { VantResolver } = require('@vant/auto-import-resolver');
const AutoImport = require('unplugin-auto-import/webpack');
const Components = require('unplugin-vue-components/webpack');
const { codeInspectorPlugin } = require('code-inspector-plugin');
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')
const CompressionWebpackPlugin = require('compression-webpack-plugin');

module.exports = defineConfig({
  lintOnSave: false,
  productionSourceMap: false,
  transpileDependencies: true,
  publicPath: './',
  css: {
    loaderOptions: {
      postcss: {
        postcssOptions: {
          plugins: [
            require('autoprefixer'),
            // 其他插件
          ]
        }
      }
    }
  },
  devServer: {
    open: true,
    hot: true,//自动保存
    port:80
  },
  chainWebpack: (config) => {
    config.plugin('code-inspector-plugin').use(
      codeInspectorPlugin({
        bundler: 'webpack',
      })
    );
  },
  configureWebpack: {
    plugins: [
      // 当 unplugin-vue-components 版本小于 0.26.0 时，使用以下写法
      // AutoImport({ resolvers: [VantResolver()] }),
      // Components({ resolvers: [VantResolver()] }),
      //当大于等于 0.26.0 时，使用以下写法
      AutoImport.default({
        resolvers: [VantResolver(),ElementPlusResolver()],

      }),
      Components.default({ resolvers: [VantResolver(),ElementPlusResolver()] }),
      // new CompressionWebpackPlugin({
      //   algorithm: 'gzip', // 使用gzip压缩
      //   test: /\.js$|\.html$|\.css$/, // 匹配文件名
      //   filename: '[path][base].gz[query]', // 压缩后的文件名(保持原文件名，后缀加.gz)
      //   minRatio: 1, // 压缩率小于1才会压缩
      //   threshold: 0, // 对超过10k的数据压缩
      //   deleteOriginalAssets: true, // 是否删除未压缩的源文件，谨慎设置，如果希望提供非gzip的资源，可不设置或者设置为false（比如删除打包后的gz后还可以加载到原始资源文件）
      // }),
    ],
  },

});