javascript - Comment vue-cli crée-t-il différents codes d'interface en fonction des différents serveurs d'interface back-end?

Question

Pendant le processus de développement, l'adresse appelée par l'interface dans le composant npm run dev est une variable API définie par global global comme suit :

//Ouvrir l'environnement de développement
// global.API = '/api';

// Ouvrez l'environnement de test
// global.API = '/test';

//Environnement uat ouvert
// global.API = '/uat';

// Ouvrir l'environnement de production
// global.API = '/www';

Dans un environnement de production, comment changer automatiquement l'API en variables d'environnement de production en fonction de différentes interfaces lors de l'utilisation de npm run build ?

Answer 1

Après avoir réfléchi au code généré par vue-cli pendant quelques jours, Vue pense que vous n'avez besoin que de trois configurations : développement (npm run dev), production (npm run build) et tests unitaires (npm run test). . .

Fin de coup de gueule.

1. Ouvrez le nom du fichier config/index.js，修改build里面的env et récupérez-le en fonction de la variable d'environnement
Après modification, il ressemblera probablement à ceci :

.

module.exports = {
  build: {
    env: require('./'+(process.env.VUE_CONFIG||'prod')+'.env'),
    //......

2. Mettez prod.env.js复制两份，分别是uat.env.js、testing.env.js

dans le répertoire de configuration

3. Modifier dev.env.js、uat.env.js、testing.env.js、prod.env.js这四个文件，在大括号里面添加API: '"/api或uat或其他什么"' comme suit :

module.exports = {
  NODE_ENV: '"production"',
  API: '"/api"'
}

4. Ensuite, vous pouvez accéder à cette variable via process.env.API n'importe où.

5. Lors de l'emballage, définissez d'abord les variables d'environnementVUE_CONFIG，例如export VUE_CONFIG=uat && npm run build.

Answer 2

https://stackoverflow.com/que...

Answer 3

https://github.com/tonyljl526...
Vous pouvez jeter un œil à l'échafaudage de ce projet, qui est basé sur express, vue2 et webpack. Pour répondre à vos besoins, regardez principalement config/renderConfig.js