webpack-dev-serverを使ってwebpackの資産jsonを読む

Question

これまで、webpackを使って同型Node/Express/Reactアプリケーションを構築していて、問題なくindex.jsを提供していました。 HTMLファイル：

<script src='/bundle.js'></script> 

しかし、生産に展開するために、私は私が代わりにキャッシュの無効化のメカニズムを必要とする見つけたので、私はので、私はbundle.jsファイルに独自のビルドハッシュを追加することができますwebpack-manifest-pluginのために達しました。

プラグインとのWebPACKの設定は次のようになります。

{ 
    "main.js": "bundle.af0dc43f681171467c82.js" 
} 

：

webpack.config.jsのように見えるビルドディレクトリにmanifest.jsonファイルを出力し

var ManifestPlugin = require('webpack-manifest-plugin'); 

var output = { 
    path: path.join(__dirname, [ '/', config.get('buildDirectory') ].join('')), 
    filename: "bundle.[hash].js" 
}; 

私はmanifest.jsonのようなもので

var manifestPath = path.join(__dirname, [ '/', config.get('buildDirectory') ].join(''),'/manifest.json'); 
var manifest = require(manifestPath) 

が、私は

Error: Cannot find module 'C:\Users\banjer\projects\foo\build\manifest.json'

のWebPACK-devのサーバーではなく、ディスク上のメモリにビルドディレクトリを保持しているので、これは（私の知る限り）です

を取得しますか？いただきましたこのmanifest.jsonを読み込み、私のメインインデックスのhtmlファイルにバンドルファイル名を注入するための最良の方法、例えば？：

<script src='/bundle.af0dc43f681171467c82.js'></script> 

これらの様々な資産プラグインのドキュメントはすべてでこの手順を説明していませんが、私はwebpack-dev-server ...または私のスタック内の何かが私がまだ理解していないので、あまり明らかではないと思います。

Answer 1

私はもっと簡単なルートを使い、package.jsonのversionを使ってbundle.jsをキャッシュバスターとして追加しました。

webpack.config.js

var output = { 
    path: path.join(__dirname, [ '/', config.get('buildDirectory') ].join('')), 
    filename: 'bundle.' + JSON.stringify(require('./package.json').version) + '.js' 
}; 

module.exports = { 
    output: output, 
... 
} 

その後、私は私のスクリプトタグを持っている私の.ejsインデックスファイルを生成し、エントリスクリプトから同様の方法でpackage.jsonにお読みください。