web-dev-qa-db-ja.com

git commitのハッシュと日付をwebpackビルドに含める

React/es6/webpackを使用しています。ビルドの日付とgitハッシュをアプリのどこかに表示したいと思います。最善のアプローチは何ですか？

angularreactjswebpackecmascript-6
25
Matt

Webpackの DefinePlugin を使用できます。

// get git info from command line
let commitHash = require('child_process')
  .execSync('git rev-parse --short HEAD')
  .toString();

...
plugins: [
    new webpack.DefinePlugin({
      __COMMIT_HASH__: JSON.stringify(commitHash),
    })
  ]
...

その後、アプリで__COMMIT_HASH__

46
azium

これを行う別の方法は（in ANGULAR + REACT）：

このパッケージをインストールするだけです git-revision-webpack-plugin

ローカルgitリポジトリに基づいてビルド中にVERSIONおよびCOMMITHASHファイルを生成するシンプルなwebpackプラグイン。

サンプルコード：

webpack.config.js内（または任意のdev-prodファイル）

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

plugins: [
    new DefinePlugin({
      'VERSION': JSON.stringify(gitRevisionPlugin.version()),
      'COMMITHASH': JSON.stringify(gitRevisionPlugin.commithash()),
      'BRANCH': JSON.stringify(gitRevisionPlugin.branch()),
    }),
  ]

コンポーネント内（React）：

export class Home extends Component{
    ....

    render() {
        return(
            <div>
                {VERSION} 
                {COMMITHASH}
                {BRANCH}
            </div>
        )
    }
}

テンプレート内（Angular）：

{{ VERSION }} 
{{ COMMITHASH }}
{{ BRANCH }}
17
Vivek Doshi