In a vue-CLI environment, a NODE_ENV environment variable is configured by default. When NPM run dev is used, this is development. This is production when NPM runs build. Vue-cli developers are usually familiar with this, and the most common use of this is basically the domain header we configure ajax requests,

if (process.env.NODE_ENV === 'production') {
  axios.defaults.baseURL = 'http://customer.medsci.cn'
}
Copy the code

There is usually a distinction between the test server and the formal server environment, and the domain name we request is also distinguished, so using proces.env.node_env to distinguish the environment variables, with this globally accessible parameter, we can handle many different operations that require the environment to handle. The above process.env.node_env is the default configuration for vue-CLI. Sometimes you might think that a development environment and production environment are not enough, for example, if you want a test environment, you need to define your own. The following uses the Windows environment as an example. The MAC environment is similar. Cross-env can be installed first

npm install cross-env --save-dev
Copy the code

The vue-cli configuration is essentially webpack configuration. When we run NPM run dev, we actually perform a series of configuration in the scripts dev of package.json, that is, build/dev-server.js to start the entire service.

"devtest": "cross-env TESTING=true  node build/dev-server.js",
Copy the code

NPM run devtest can also be used to start the entire service. Notice that we added TESTING=true, which is the added environment variable TESTING:true, With the devtest configuration above, we can run NPM run devtest like NPPM run We can’t get process.env.testing in our project. We can get it in webpack. We can get it in vue- CLI configuration files Changes in the root directory under the config and have dev env. Js and prod env. Js, the two files is the key, we add a line under the NODE_ENV TESTING: process. The env. TESTING

module.exports = {
  NODE_ENV: '"production"'.TESTING: process.env.TESTING
}
Copy the code

This gives us global access to the process.env.TESTING variable, which is undefined when we run dev and true when we run devtest. Similarly, we can add an NPM run test command, Vue – CLI configuration is still webpack configuration, ordinary Webpack configuration can also use this method. My blog blog.noob6.com/2018/07/08/…