import{_ as o,r as n,o as l,c as p,b as e,d as a,a as s,w as d,f as r}from"./app.ae6ada9d.js";const h={},u=r(`

环境变量

在构建或者代码在端上运行中需要一些跟区分于环境的变量,用于配置构建流程或者运行时过程,这时候我们可以配置环境变量。

配置环境变量

命令行添加

比如:

# OS X, Linux
PORT=3000 fes dev

# Windows (cmd.exe)
set PORT=3000 && fes dev
`,6),v={href:"https://github.com/kentcdodds/cross-env",target:"_blank",rel:"noopener noreferrer"},b=e("div",{class:"language-bash line-numbers-mode","data-ext":"sh"},[e("pre",{class:"language-bash"},[e("code",null,[e("span",{class:"token function"},"pnpm"),a(),e("span",{class:"token function"},"add"),a(" cross-env "),e("span",{class:"token parameter variable"},"--dev"),a(` cross-env `),e("span",{class:"token assign-left variable"},"PORT"),e("span",{class:"token operator"},"="),e("span",{class:"token number"},"3000"),a(` fes dev `)])]),e("div",{class:"line-numbers","aria-hidden":"true"},[e("div",{class:"line-number"}),e("div",{class:"line-number"})])],-1),m=e("div",{class:"language-bash line-numbers-mode","data-ext":"sh"},[e("pre",{class:"language-bash"},[e("code",null,[e("span",{class:"token function"},"npm"),a(` i cross-env --save-dev cross-env `),e("span",{class:"token assign-left variable"},"PORT"),e("span",{class:"token operator"},"="),e("span",{class:"token number"},"3000"),a(` fes dev `)])]),e("div",{class:"line-numbers","aria-hidden":"true"},[e("div",{class:"line-number"}),e("div",{class:"line-number"})])],-1),f=r(`

.env 文件配置

Fes.js 中约定根目录下以 .env 开头的文件为环境变量配置文件。

比如:

PORT=3000

然后执行

fes dev

会以 3000 端口启动 dev server。

本地临时配置

可以新建 .env.local,这份配置会和 .env 做合并后形成最终配置。

环境配置

可以通过环境变量 FES_ENV 区分不同环境来指定配置,这时候必须在执行命令前添加 FES_ENV 保证执行加载环境变量配置文件逻辑前 FES_ENV 已设置。

举个 🌰 :

FES_ENV=sit fes dev

如果存在 .env.sit 文件,则会将 .env.sit 的配置和 .env 做合并后形成最终配置。

配置优先级

本地临时配置 > 环境配置 > 基础配置

提示

如果多份配置中存在相同的配置项,则优先级高的会覆盖优先级低的

编译时配置列表

编译时配置是在构建过程需要的变量,开放给用户配置。

FES_ENV

指定当前的环境,不同环境各自的配置文件。

提示

FES_ENV 在会在加载.env前使用,所以只能用命令行方式配置。

FES_PRESETS

添加额外的插件集入口

FES_PLUGINS

添加额外的插件入口

PORT

fes dev 时服务指定的端口号,默认是 8000

HOST

默认是 localhost

HTTPS

默认是 false

WATCH

设为 none 时不监听文件变更。比如:

WATCH=none fes dev

BABEL_CACHE

默认开启 Babel 编译缓存,值为 none 时禁用缓存。

ANALYZE

用于分析 bundle 构成,默认关闭。

比如:

ANALYZE=1 fes build

ANALYZE_MODE

默认是server

ANALYZE_PORT

默认是8888

CLEAR_OUTPUT

仅仅在 build 时生效。如果设置为 none,就不会在构建前清除 Output 文件内容。

RM_TMPDIR

仅仅在 build 时生效。如果设置为 none,就不会在构建后清除 .fes 临时文件内容。

process.env

运行时配置需要以 FES_APP_ 开头,比如在 .env 中配置:

FES_APP_KEY=123456789

在代码中使用:

console.log(process.env.FES_APP_KEY);
// 输出 123456789

除了用户自定义的以FES_APP_开头的变量,还提供如下配置:

`,56);function g(_,x){const c=n("ExternalLinkIcon"),i=n("CodeGroupItem"),t=n("CodeGroup");return l(),p("div",null,[u,e("p",null,[a("如果要同时考虑 OS X 和 Windows,可借助三方工具 "),e("a",v,[a("cross-env"),s(c)])]),s(t,null,{default:d(()=>[s(i,{title:"PNPM",active:""},{default:d(()=>[b]),_:1}),s(i,{title:"NPM"},{default:d(()=>[m]),_:1})]),_:1}),f])}const E=o(h,[["render",g],["__file","env.html.vue"]]);export{E as default};