web-dev-qa-db-ja.com

nodejsサーバーなしでクライアント側でwebpackを使用できますか？

すべてのhtml、js、cssファイルをAmazon s3に保存し、APIを介してRESTfulサーバーと通信するWebアプリを構築しようとしています。

遅延読み込みと、おそらく反応ルーターを使用したルーティングを実現しようとしています。 webpackには、遅延読み込みと同様に機能するこの機能コード分割があるようです。

ただし、私が見つけたすべてのチュートリアルと例には、小さなノードのExpressサーバーであるwebpack-dev-serverが含まれています。とにかく、ビルド時にバンドルを生成し、すべてをAmazon s3にアップロードして、AngularのocLazyLoadingに似たものを実現できるでしょうか？

node.jsamazon-s3reactjswebpackwebpack-dev-server
16
LoveProgramming

静的バンドルjsファイルを作成することは間違いなく可能です。これは、webpack-dev-serverを含まない本番コードで使用できます。

参照として この例 を参照してください（注：私はこのリポジトリの所有者です）。 webpack.prod.config.jsは、node.jsを介してwebpackを使用して本番用のバンドルファイルを作成しますが、それ自体はnode.jsを必要としません。そのため、単純な静的ファイルとして提供することができます（これはライブの例で行われます）。

主な違いは、開発環境と本番環境でのエントリポイントの記述方法です。開発にはwebpack-dev-serverが使用されています

module.exports = {
    entry: [
        'webpack-dev-server/client?http://localhost:3000',
        'webpack/hot/only-dev-server',
        './src/index'
    ],
    // ...
}

実稼働環境では、webpack-dev-serverとホットリロード部分をスキップします

module.exports = {
    entry: [
        './src/index'
    ],
    // ...
}

コードを複数のバンドルに分割する場合は、 複数のエントリポイント を定義し、それに応じてファイルをリンクする方法を確認することをお勧めします。

10
dotcs