环境变量

San CLI 会按照下面的优先级在项目的根目录中读取环境变量：

.env.${mode}.local
.env.${mode}
.env.local
.env

mode 取值范围为production和development。

.env文件内的格式为每行一个键值对数据，举例如下：

ONE=1
SAN_VAR_TRUE=true

在.env的键值对 San CLI 会根据优先级进行合并，然后复制给process.env。例如上面赋值之后的结果是process.env.ONE=1。.env文件的读取是在加载san.config.js之前的，所以在san.config.js中可以直接使用.env文件设置的process.env变量。

注意：对于NODE_ENV和BABEL_ENV这两个 webpack 和 Babel 用到的环境变量，如果.env中不指定，则会根据build或者serve命令的--mode来指定。

环境变量除了上面的功能之外，还可以做一些其他的用法使用，比如在插件中可以使用.env中指定的环境变量，也可以在前端代码中使用环境变量的赋值。

build命令中使用远程部署参数 --remote

在san build命令中，我们可以使用--remote <remote-name>的方式来将构建结果通过deploy-files插件上传到对应的开发机，方便进行测试和部署。而这里传入的remote-name实际是开发机的别名，比如小明的开发机就可以在.env.production中配置以xiaoming命名的相关的字段：

# .env.production
SAN_REMOTE_XIAOMING_RECEIVER=http://www.xiaoming.com:8080/receiver.php
SAN_REMOTE_XIAOMING_TEMPLATE_PATH=/home/work/nginx_static/html/test/template
SAN_REMOTE_XIAOMING_STATIC_PATH=/home/work/nginx_static/html/test/static
SAN_REMOTE_XIAOMING_STATIC_DOMAIN=http://test.bdstatic.com:8888

这样，当我们执行san build --remote xiaoming的时候会自动去寻找.env.production的 remote 配置，打包结束后会调用deploy-files上传数据到小明的开发机。

插件中使用环境变量，也可以按照这个思路来用，因为插件的调用也是在加载.env文件之后的。

前端代码中使用环境变量的赋值

在.env中定义的以SAN_VAR_*开头的变量会被DefinePlugin作为变量直接解析成对应的值，即：

# .env 中环境变量设置为
SAN_VAR_HELLO=hello

则在代码中如果直接使用console.log(HELLO)，经过编译后就会变成console.log('hello')。

  1. SAN_VAR_*的定义不仅仅是在.env文件中，还可以在其他的打包之前的地方定义，比如在san.config.js中；
  2. 在代码中可以继续使用类似process.env.NODE_ENV这类变量。

常见应用场景举例

  1. 某个常量的值，线下环境和线上环境不同，例如线下请求的数据接口是后端工程师的一个线下地址，那么可以使用环境变量定义这个常量；
  2. 部署代码到自己的开发机，可以将环境变量写到.env.local中，并且将该文件添加到.gitignore中；
  3. 任何需要在打包之前就计算好得到的变量，可以直接在san.config.js中直接赋值。