跳至主要內容

Vite

哓番茄小于 1 分钟ViteQuickly Start前端工程化

Vite

vue3 + vite env 环境配置

Vite 环境变量open in new window

新建文件

在项目跟目录建 .env.development .env.production

// .env.development
NODE_ENV = development
VITE_APP_BASE_API = /stage-api

创建代码提示 env.d.ts

src/types/env.d.ts

interface ImportMetaEnv {
  VITE_APP_BASE_API: string;
}

组件中使用

import.meta.env.VITE_APP_BASE_API

vite.config.ts 中使用

import { defineConfig, loadEnv } from 'vite'
export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd())
  console.log('command', env) // { VITE_APP_BASE_API: '/stage-api', VITE_USER_NODE_ENV: 'development' }
  return {
    plugins[],
    base: env.VITE_APP_BASE_API
  }
})

Vite 插件开发

Vite2 插件开发指南open in new window十分钟带你了解 vite 插件开发open in new window