web前端工程化开发中这样配置多环境更灵活

可以在项目根目录创建一个.env-cmdrc.js文件，因为这么做就不需要指定配置文件路径了，env-cmd默认查找的就是根目录的这个文件。扩展名也可以是json，但我推荐用js，为什么呢？因为js更加灵活。

在Web前端工程化开发中，我们通常需要多个环境，至少需要开发和生产环境，也可能还需要不同的测试环境。那么，怎样配置多环境的呢？

通常，一些脚手架都有配置多环境的解决方案，比如在项目根目录创建多个.env文件。但我不喜欢在根目录创建很多.env文件，我觉得这样不够优雅，也不够灵活，并没有采用这种方案，而是使用了其它的解决方案。

我使用了一个第三方包，叫：env-cmd，它的用法非常简单。我们需要创建一个环境变量配置文件，扩展名可以是json或者js，文件名可以随便起，可以放到任何目录，使用时指定配置文件路径即可。

我比较推荐在项目根目录创建一个.env-cmdrc.js文件，因为这么做就不需要指定配置文件路径了，env-cmd默认查找的就是根目录的这个文件。扩展名也可以是json，但我推荐用js，为什么呢？因为js更加灵活。

首先，提醒大家一点，自定义的环境变量，命名一定要遵守脚手架的命名约定，比如：vue-cli要求必须以VUE_APP_开头。

如下代码是env-cmd的配置文件长相，导出的对象属性名就是env-cmd 环境名字，这是用js的方式。如果用json，就不需要导出了。

// .env-cmdrc.js
module.exports = {
   
  development: {
   
    API_BASE: '/api'
  },
  production: {
   
    API_BASE: '/'
  },
  test: {
   
    API_BASE: