Webpack沒有為環境變量分配值

Question

我想將我的網址設為私有。

在我的Webpack.config.js我聲明了一些環境變量，並且需要dotenv-webpack 。

plugins: [
  new webpack.EnvironmentPlugin([
    'NODE_ENV',
    'MY_URL'
  ]),
  new Dotenv({
    path: './.env', // Path to .env file (this is the default)
    safe: false // load .env.example (defaults to "false" which does not use dotenv-safe)
  })
]

然后，我創建了一個.env並添加了MY_URL=http://my.secret.url

但是當我登錄process.env.MY_URL它是undefined

我怎樣才能解決這個問題？

Answer 1

我可以分享對我有用的方式。 我將所有環境變量移動到config.js並在package.json中設置了當前環境（本地或產品），並且可以使用npm run local或npm run prod

的package.json

 { "name": "workshop_butler_widget", "version": "1.0.0", "description": "Workshopbutler widget", "author": "http://workshopbutler.com", "license": "ISC", "devDependencies": { .... }, "scripts": { "local": "NODE_ENV=local webpack-dev-server", "prod": "NODE_ENV=prod webpack-dev-server" } } 

config.js

 module.exports = { local: { url: 'http://local' }, prod: { url: 'http://prod' } } 

webpack.config.js

 const configs = require('./config.js'); const env = process.env.NODE_ENV; const current = (env === "local")? configs.local: configs.prod; ... plugins: [ new webpack.DefinePlugin({ 'NODE_ENV': JSON.stringify(env), 'MY_URL': JSON.stringify(current.url) }) ] 

或者您可以通過'fs'npm包直接在webpack.config.js中讀取.env文件