@suxhk/vite-plugin-env-auto-types

Automatically generate env type

Motivation

Want to automatically get prompted for import.meta.env instead of managing it manually 👉 vitejs.dev/guide/env-and-mode

Usage

install

npm i @suxhk/vite-plugin-env-auto-types -D

useing

// vite.config.ts
import { defineConfig } from "vite"
import EnvAutoTypes, { parse } from "@suxhk/vite-plugin-env-auto-types"

export default defineConfig(({ command, mode }) => {
  const root = process.cwd()
  const env = loadEnv(mode, root)
  const viteEnv: ImportMetaEnv = parse(env) // Convert data type
  console.log(viteEnv.VITE_APP_NAME)
  return {
    base: viteEnv.VITE_APP_PUBLIC_PATH,
    ...
    plugins: [
      EnvAutoTypes({
        dts: 'env-auto.d.ts' // Write file location, default to "env-auto.d.ts"
      })
    ]
  }
})

// name.vue || main.ts
import { VITE_APP_PUBLIC_PATH , VITE_APP_DEV_PORT , VITE_APP_DEL_CONSOLE} from 'vite-env'

console.log( VITE_APP_PUBLIC_PATH ) // '/demo' is string
console.log( VITE_APP_DEV_PORT ) // 8080 is number
console.log( VITE_APP_DEL_CONSOLE ) // false is boolean

// tsconfig.json
{
    "include": ["./env-auto.d.ts"] // Ensure that files are scanned
}

/* eslint-disable */
/* prettier-ignore */
// @ts-nocheck
// noinspection JSUnusedGlobalSymbols
// Generated by @suxhk/vite-plugin-env-auto-types

interface ImportMetaEnv {
  readonly VITE_APP_COOKIE_KEY: string
  readonly VITE_APP_OUTDIR: string
  readonly VITE_APP_NAME: string
  readonly VITE_APP_DEV_PORT: number
  readonly VITE_APP_NPROGRESS: boolean
  readonly VITE_APP_DEBUG: boolean
  readonly VITE_APP_MODE: string
  readonly VITE_APP_PUBLIC_PATH: string
  readonly VITE_APP_BASE_API: string
  readonly VITE_APP_DEV_PROXY: string
}
interface ImportMeta {
  readonly env: ImportMetaEnv
}

declare module "vite-env" {
   const VITE_APP_COOKIE_KEY: Readonly<string>
   const VITE_APP_OUTDIR: Readonly<string>
   const VITE_APP_NAME: Readonly<string>
   const VITE_APP_DEV_PORT: Readonly<number>
   const VITE_APP_NPROGRESS: Readonly<boolean>
   const VITE_APP_DEBUG: Readonly<boolean>
   const VITE_APP_MODE: Readonly<string>
   const VITE_APP_PUBLIC_PATH: Readonly<string>
   const VITE_APP_BASE_API: Readonly<string>
   const VITE_APP_DEV_PROXY: Readonly<string>
}

License

Made with markthree

Published under MIT License.