环境变量

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

配置环境变量

命令行添加

比如:

# OS X, Linux
PORT=3000 fes dev

# Windows (cmd.exe)
set PORT=3000 && fes dev
1
2
3
4
5

如果要同时考虑 OS X 和 Windows,可借助三方工具 cross-env在新窗口打开

yarn add cross-env --dev
cross-env PORT=3000 fes dev
1
2
npm i cross-env --save-dev
cross-env PORT=3000 fes dev
1
2

.env 文件配置

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

比如:

PORT=3000
1

然后执行

fes dev
1

会以 3000 端口启动 dev server。

本地临时配置

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

环境配置

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

举个 🌰 :

FES_ENV=sit fes dev
1

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

配置优先级

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

提示

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

编译时配置列表

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

FES_ENV

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

提示

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

FES_PRESETS

添加额外的插件集入口

FES_PLUGINS

添加额外的插件入口

PORT

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

HOST

默认是 localhost

HTTPS

默认是 false

WATCH

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

WATCH=none fes dev
1

BABEL_CACHE

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

ANALYZE

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

比如:

ANALYZE=1 fes build
1

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
1

在代码中使用:

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

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

  • NODE_ENV:Node 环境变量

  • FES_ENV:Fes.js 环境变量

  • BASE_URL:等同于 publicPath