vue.js在打包的时候自动区分正式服和测试服的api url

我们在编写一个vue.js的时候往往会有正式服务器和测试服务器。
比如正式服http://api.marsdict.com
测试服则为http://apitest.marsdict.com

我们查看vue cli生成的webpack配置文件可以发现/build/webpack.dev.conf.js和/build/webpack.prod.conf.js两个文件中都通过

new webpack.DefinePlugin({
      'process.env': env
    }),

向我们的js传递了一个process.env变量,那么我们就可以使用它了。
例如我是在main.js这么实现区分的：

Vue.use(
  Ajax,
  (function() {
    return {
      baseURL:
        process.env === "production"
          ? "http://api.marsdict.com"
          : "http://apitest.marsdict.com"
    };
  })()
);

有关DefinePlugin可以阅读文档：http://webpack.github.io/docs...

阅读过其他人一些项目，有用window.location.href.indexOf('正式服域名') >= 0先来判断运行的环境再决定api的url，感觉不是很合理。

应该是正式服打包一份，测试服打包一份，而不是在运行时在判断api url是哪个。记录一下。