vue3 vite.config.js 配置2. 创建配置文件

1.初始化项目

$ npm init vite-app <project-name>
$ cd <project-name>
$ npm install
$ npm run dev

or

$ yarn create vite-app <project-name>
$ cd <project-name>
$ yarn
$ yarn dev

2. 创建配置文件

可以手动创建 vite.config.js or vite.config.ts或者使用 vite --config my-config.js创建

常见配置

import { resolve } from 'path';

function pathResolve(dir) {
  return resolve(__dirname, '.', dir);
}

module.exports = {
  /**
   * 在生产环境的基本公共路径。
   * @default '/'
   */
  //base: '',

  /**
   * 构建输出目录。如果目录存在，它将在构建之前被删除。
   * @default 'dist'
   */
  // outDir: 'dist,

  // 端口号
  // port: 3000,

  // 是否自动在浏览器打开
  // open: true,

  // 是否开启 https
  // https: false,

  // 服务端渲染
  // ssr: false,

  // 引入第三方的配置
  /* optimizeDeps: {
    include: ['moment', 'axios'],
  }, */

  // 目录别名
  alias: {
    '/@/': pathResolve('src'),
  },

  // 打包后静态资源 js/css/image 存放目录，@default '_assets'
  assetsDir: '',

  // 代理
  /* proxy: {
        // string shorthand
        '/foo': 'http://localhost:4567/foo',
        // with options
        '/api': {
          target: 'http://jsonplaceholder.typicode.com',
          changeOrigin: true,
          rewrite: path => path.replace(/^\/api/, '')
        }
    } */
};

更多配置参考: config.ts

仅供学习参考