Comment passer les variables de fichier .env à webpack config?

Je suis nouveau sur webpack et j'ai travaillé sur presque toutes les sections de construction, mais maintenant le problème est que je veux passer les variables d'environnement d'un fichier .env à webpack config, afin que je puisse transmettre ces variables à mes fichiers. brancher.Comment passer les variables de fichier .env à webpack config?

Actuellement, je suis capable de passer la variable d'environnement directement de webpack à ma construction. S'il vous plaît voir le code ci-dessous que j'ai utilisé dans le webpack.

new webpack.DefinePlugin({ 
      "API_URL": JSON.stringify("http://my-api.com"), 
      "SECRET_KEY" : "MYSECRETKEYGOESHERE" 
     }),

Mon script de compilation package.json est

"scripts": { 
    "start": "NODE_ENV=development webpack-dev-server --progress --port 8000 --content-base app/build/src" 
    }

Source

2017-09-14 ninja dev

Vous pouvez utiliser dotenv forfait à cet effet

Référence: https://www.npmjs.com/package/dotenv https://github.com/motdotla/dotenv

En haut de fichier de configuration webpack, nécessitent dotenv comme suit (ton chemin .env currectly)

var dotenv = require('dotenv').config({path: __dirname + '/.env'});

dans la section plugins config webpack utiliser

new webpack.DefinePlugin({ 
      "process.env": dotenv.parsed 
     }),

Maintenant, vous pouvez utiliser la variables d'env à travers votre application. essayez console.log(process.env); dans votre code d'application

Source

2017-09-15 05:21:08

Super idée! Je n'avais pas pensé à accéder à la valeur 'parsed' de' dotenv' avant. – IsenrichO

J'ai essayé cette solution mais pour les variables de chaîne, elle renvoie un objet et non une chaîne. Par exemple, si j'ai DB_USERNAME = MY_USRNAME, et que j'essaie console.log (process.env.DB_USERNAME), il me donne l'objet MY_USRNAME, et non "MY_USRNAME". J'utilise dotenv 5.0.0. Comment puis-je le résoudre? – retrobitguy

Je ne peux pas commenter pour clarifier toute information, donc mes excuses pour la réponse.

Vous pouvez faire:

var env = require('.env');

puis

new webpack.DefinePlugin({ 
      "API_URL": JSON.stringify("http://my-api.com"), 
      "SECRET_KEY" : "MYSECRETKEYGOESHERE", 
      "env_property": env.property 
     }),

Mais je fais des suppositions au sujet de votre fichier .env et la façon dont sa mise en place avec cette réponse

Source

2017-09-14 21:33:05 DevinFlick

Pourquoi est-ce que vous faites de la chaîne 'API_URL'? Et, pourquoi ne pas stringifier aussi le 'SECRET_KEY'? –

Comment passer les variables de fichier .env à webpack config?

Répondre

Questions connexes