Webpack DefinePlugin未將環境變量傳遞到節點服務器

Webpack的DefinePlugin未通過環境變量。我使用的WebPack v2.2.1Webpack DefinePlugin未將環境變量傳遞到節點服務器

我的WebPack plugins塊低於：

plugins: [ 
    new webpack.DefinePlugin({ 
    'process.env.NODE_ENV': JSON.stringify("development"), 
    'process.env.API_URL': JSON.stringify("test") 
    }), 
    new webpack.optimize.OccurrenceOrderPlugin(), 
    new webpack.HotModuleReplacementPlugin(), 
    new webpack.NoEmitOnErrorsPlugin() 
]

server.js：

console.log('env', process.env.NODE_ENV) // undefined 
console.log('url', process.env.API_URL); // undefined

.babelrc配置：

{"presets": ["es2015", "stage-0", "react"]}

我已經關掉了babel預設，將Webpack恢復到2.0.0，並且真的沒有看到可能導致這些變量不被複制的原因。如果我需要提供任何其他信息或代碼，lmk。 :)

來源

2017-02-04 Brady

我沒有看到這個不工作的原因。 – cgatian

很高興知道我不是太瘋狂XD – Brady

使用'console.log（）'並將你的webpack輸出到控制檯，以確保某些東西不會覆蓋它。（如果你正在合併多個配置） – cgatian

希望這仍然有助於有人在那裏。

Webpack創建靜態包文件，所以在webpack做它的時候環境變量必須是可用的。

基於.babelrc文件，我可以看到它是與webpack捆綁在一起的反應應用程序。所以，你想要做的是，你需要做以下安裝dotenv作爲一個依賴npm install --save dotenv

在你webpack.config.js文件：

//require dotenv and optionally pass path/to/.env 
    const DotEnv = require('dotenv').config({path: __dirname + '/.env'}), 
      webpack = require('webpack'), 

    //Then define a new webpack plugin which reads the .env variables at bundle time 
      dotEnv = new webpack.DefinePlugin({ 
       "process.env": { 
       'BASE_URL': JSON.stringify(process.env.BASE_URL), 
       'PORT': JSON.stringify(process.env.PORT) 
      } 
     }); 

    // Then add the newly defined plugin into the plugin section of the exported 
    //config object 
    const config = { 
     entry: `${SRC_DIR}/path/to/index.js`, 
     output: { 
      path: `${DIST_DIR}/app`, 
      filename: 'bundle.js', 
      publicPath: '/app/' 
     }, 
     module: { 
      loaders: [ 
       { 
        test: /\.js?$/, 
        include: SRC_DIR, 
        loader: "babel-loader", 
        exclude: /node_modules/, 
        query: { 
         presets: ["react", "es2015", "stage-3"] 
        } 
       } 
      ] 
     }, 
     plugins: [ 
      dotEnv 
     ] 
    }; 
    module.exports = config;

所以會發生什麼是捆綁時，環境變量是全球存儲到新定義的WebPack插件創建的process.env對象，這使得我們的變量通過process.env.[VARIABLE_NAME]

PS任何地方訪問我們的代碼庫中：在雲服務器蘇ch as heroku，確保在部署代碼之前設置所有所需的環境變量。如果在代碼部署後進行更改，則需要重新部署webpack以更新存儲的變量。該方法適用於反應和角度。我相信它應該適用於所有的webpack構建。編輯：此外，我們必須對我們傳入webpack插件的環境變量執行JSON.stringify()。

來源

2017-11-07 06:31:40 saheedt

Webpack DefinePlugin未將環境變量傳遞到節點服務器

回答

相關問題