Vue Webpack Practical Tips Summary

Different interface addresses

are developed during development, and the front and rear ends are developed simultaneously. The interface to the front end call is also inside the local area network. However, when the project pushes to the line, the interface will be obtained from the real server, and there is frequent switched between the test interface and the real interface, which is very nausea.

In the first step, in the WebPack configuration file, different interface addresses
 open the dev.en.js file. Modification is as follows:   
VAR MERGE = Require (‘WebPack-Merge’) Var Prodenv = Require (‘./prod.env’) module.exports = Merge (Prodenv, {Node_env: ‘”development”, API_ROOT:’ “//” // Add API address})

Also in Prod.env.
   Module.Exports = {node_env: '"Production", API_ROOT:' "// "'}

Step 2, call settings in the code

, such as my: src / config / api.js file

 // The original API interface address var root = '' 
 / / New configuration API interface address var root = process.Env.Api_root   When the NPM Run dev is running, it is the test interface. And we run 
When the NPM Run Build packaging project, the package is the official interface of the server

© Copyright Notice
Just support it if you like
comment Grab the couch

Please log in to comment