const {defineConfig} = require('@vue/cli-service')
const postcssPxToViewport = require('postcss-px-to-viewport')
const path = require('path')

module.exports = defineConfig({
  publicPath: './',
  transpileDependencies: false, // 我们自己管，不让 CLI 插手
  lintOnSave: false,
  devServer: {client: {overlay: false}},

  configureWebpack(config) {
    // 调试
    config.devtool = 'source-map'
    // 别名
    config.resolve.alias['@'] = path.resolve(__dirname, 'src')

    /* 1. 追加 ini 规则 */
    config.module.rules.push({
      test: /\.ini$/,
      use: 'raw-loader',
    })

    /* 2. 追加 ES5 规则（只转 src，不转 node_modules） */
    // config.module.rules.push({
    //   test: /\.js$/,
    //   include: path.resolve(__dirname, 'src'),
    //   use: {
    //     loader: 'babel-loader',
    //     options: {
    //       presets: [
    //         [
    //           '@babel/preset-env',
    //           {
    //             targets: {ie: '11'}, // 强制 ES5
    //             corejs: 3,
    //             useBuiltIns: 'entry',
    //           },
    //         ],
    //       ],
    //     },
    //   },
    // })
  },
  devServer: {
    client: { overlay: false },
    proxy: {
      '/api': {
        target: 'http://192.168.3.35:8381',
        changeOrigin: true,
        pathRewrite: { '^/api': '' },
      },
    },
  },

  css: {
    /* 你的 px-to-viewport 配置不动 */
    loaderOptions: {
      postcss: {
        postcssOptions: {
          plugins: [
            postcssPxToViewport({
              unitToConvert: 'px',
              viewportWidth: 1920,
              unitPrecision: 6,
              viewportUnit: 'vw',
              fontViewportUnit: 'vw',
              propList: ['*'],
              selectorBlackList: ['ignore-'],
              minPixelValue: 1,
              mediaQuery: false,
              replace: true,
              exclude: /node_modules/,
              include: [],
              landscape: false,
            }),
          ],
        },
      },
    },
  },
})