如何使用webpack输出的变量？

Question

我正在尝试使用https://www.npmjs.com/package/git-revision-webpack-plugin这个据说公开COMMITHASH变量的webpack 插件在我的 React 应用程序中显示 git commit hash

在我的 jsx 中我包括：

<p>{process.COMMITHASH}</p>

并在生产 webpack 配置中安装插件，如下所述：

plugins: [
  new GitRevisionPlugin()
]

但生成的 html 返回<p></p>

Answer 1

如果您想访问COMMITHASH代码中的变量，则需要使用该Define插件，正如此处文档中所述： https: //www.npmjs.com/package/git-revision-webpack-plugin#plugin-api

var GitRevisionPlugin = require('git-revision-webpack-plugin');
var webpack = require('webpack');
var gitRevisionPlugin = new GitRevisionPlugin()

module.exports = {
  plugins: [
    new webpack.DefinePlugin({
      'VERSION': JSON.stringify(gitRevisionPlugin.version()),
      'COMMITHASH': JSON.stringify(gitRevisionPlugin.commithash()),
    })
  ]
};

COMMITHASH然后，当您构建捆绑包时，代码中出现的每个“constant”都应该被 webpack 替换。