1. Vite创建Vue项目

Vite 需要 Node.js 版本 >= 12.0.0。

使用yarn
yarn create vite
使用npm
npm init vite@latest
指定项目名称和模板快速搭建
# npm 6.x
npm init vite@latest my-vue-app --template vue

# npm 7+, 需要额外的双横线：
npm init vite@latest my-vue-app -- --template vue

# yarn
yarn create vite my-vue-app --template vue

2. 常用配置

// 通过引入defineConfig来加入代码提示
import { defineConfig } from 'vite'
// 通过引入vue插件来完成对vue的支持,须在plugins中注册
import vue from '@vitejs/plugin-vue'
const { resolve } = require('path')
export default defineConfig({
  //1.别名配置
  resolve: {
    alias: [
      { find: '@', replacement: resolve(__dirname, 'src') },
      { find: 'comps', replacement: resolve(__dirname, 'src/components') },
    ],
  },
  //2.插件相关配置
  plugins: [vue()],
  //3.服务有关配置
  server: {
    open: true,
    /* 设置为0.0.0.0则所有的地址均能访问 */
    host: '0.0.0.0',
    port: 3000,
    https: false,
    proxy: {
      '/api': {
        /* 目标代理服务器地址 */
        target: 'http://xxx:9000/',
        /* 允许跨域 */
        changeOrigin: true,
      },
    },
  }
})