如何使用webpack中的npm腳本從代碼訪問命令行變量？

Question

我需要從“ constants.js”文件中的npm腳本訪問命令行參數。

我發現可以使用process.env訪問webpack.config.js文件中的參數，但是在應用程序源文件中未定義參數。

我需要從控制台運行腳本，例如：

npm webpack-dev-server --hot MY_PARAMETER=some_value

然后以某種方式在我的constants.js中訪問MY_PARAMETER，例如：

process.env.MY_PARAMETER === "some_value"   // true

有人可以幫忙嗎？ 非常感謝。

Answer 1

如果您有一個.env文件，那么最好的選擇是使用dotenv-webpack （以及可選的string-replace-webpack-plugin或類似的東西）。 閱讀該文檔（作為建議），如果您擔心安全性，則可能需要在VCS忽略文件（ .gitignore ， .hgignore等）中添加.env.local條目，並使用以下命令調用new DotenvPlugin具有已定義path的對象，即

const DotEnvPlugin = require('dotenv-webpack');
module.exports = {
/* other settings */
  plugins: [
    // other plugins,
    new DotEnvPlugin({
      path:'.env.local',
      // safe: true, // load '.env.example' to verify the '.env' variables are all set. Can also be a string to a different file.
    })
  ]
}

如果您沒有.env文件，則上面的string-replace-webpack-plugin可能會有用，您只需將這些變量添加到您的環境中即可。 （有關如何操作，請咨詢您的操作系統/管理員）

最后，您可以在命令行調用中定義它們。 它們通常只需要在發出任何命令之前執行，即（以bash格式）：

MY_PARAMETER=some_value node_modules/.bin/webpack-dev-server --hot