vue3脚手架怎么配置

Vue3的脚手架工具是Vue CLI 4.x，它提供了一些默认配置，也可以通过配置文件进行自定义配置。

配置文件主要包括：

- vue.config.js：用于项目构建时的配置文件，比如修改webpack配置、配置代理、配置插件等。
- babel.config.js：用于Babel转码的配置文件。
- postcss.config.js：用于PostCSS的配置文件。

下面是一个基本的vue.config.js配置：

module.exports = {
  // 基本路径
  publicPath: '/',
  // 输出文件目录
  outputDir: 'dist',
  // webpack-dev-server 相关配置
  devServer: {
    // 设置代理
    proxy: {
      '/api': {
        target: '<url>',
        ws: true,
        changeOrigin: true
      },
      '/foo': {
        target: '<other_url>'
      }
    }
  },
  // eslint-loader 是否在保存的时候检查
  lintOnSave: true,
  // 是否使用包含运行时编译器的 Vue 构建版本
  runtimeCompiler: false,
  // 生产环境是否生成 sourceMap 文件
  productionSourceMap: true,
  // css相关配置
  css: {
    // 是否分离css（插件ExtractTextPlugin）
    extract: true,
    // 是否开启 CSS source maps
    sourceMap: false,
    // css预设器配置项
    loaderOptions: {
      css: {},
      postcss: {}
    },
    // 是否启用 CSS modules for all css / pre-processor files.
    modules: false
  },
  // webpack配置
  configureWebpack: {
    // 关闭 webpack 的性能提示
    performance: {
      hints: false
    }
  },
  // webpack链式操作
  chainWebpack: () => {},
  // 配置高于chainWebpack中关于 css loader 的配置
  css: {
    loaderOptions: {
      css: {
        // 这里的选项会传递给 css-loader
      },
      postcss: {
        // 这里的选项会传递给 postcss-loader
      }
    }
  },
  // 所有 webpack-dev-server 的选项都支持
  devServer: {
    proxy: {
      '/api': {
        target: '<url>',
        ws: true,
        changeOrigin: true
      },
      '/foo': {
        target: '<other_url>'
      }
    }
  },
  // 是否为 Babel 或 TypeScript 使用 thread-loader
  parallel: require('os').cpus().length > 1,
  // 向 PWA 插件传递选项
  pwa: {},
  // 可以用来传递任何第三方插件选项
  pluginOptions: {}
}

需要注意的是，如果是在vue-cli 3.x升级到vue-cli 4.x，需要将原来的配置文件中的内容迁移到新的配置文件中。同时，新的vue.config.js中取消了baseUrl选项，改用publicPath选项来配置基本路径。