npm/webpackで事前ビルドされたモジュールのデバッグ版をロードする

Question

/debugで開発したいnpmにあらかじめビルドされて利用可能なjavascriptライブラリがあります。私の場合、それはopenlayersです。

のJavaScriptファイルを必要とし、デバッグしたいの古典的な方法で、1は単なるデバッグバージョンに生産バージョンからスクリプトURLを切り替えるだろうが、すなわち：

へただし、webpackを使用してnpm経由でインポートする場合：

import openlayers from 'openlayers' 

eライブラリ、上のol.jsスクリプトと同じです。サイドノートでは

、構築済みのライブラリを解析し、あなたがこのような何か含まなければならないことについての警告をスローしようとしているのWebPACK停止する：戻る当面の問題に

// Squash OL whinging 
webpackConfig.module.noParse = [ 
    /\/dist\/ol.*\.js/, // openlayers is pre-built 
] 

を：どのように私は条件付きで読み込むことができますこのように事前にビルドされインポートされたモジュールの別のエントリポイント？

もちろん、私はハッキーなやり方でできます。 node_modules/OpenLayersを/ package.jsonに入ると

"browser": "dist/ol-debug.js", 

に

"browser": "dist/ol.js", 

からブラウザのフィールドを切り替えることで、私はWebPACKのを介して、または別のを使用して別のエントリポイントを要求できる方法はありますインポート構文ですか？仕様によると、ブラウザのエントリポイントのヒントを許可するために、ブラウザのフィールドを更新するために、まずライブラリのメンテナを請願しなければなりませんか？ https://github.com/defunctzombie/package-browser-field-spec

これを行うより効果的な方法についての考え方はありますか？プログラマチックに、env変数に基づいてライブラリの本番版とデバッグ版の読み込みを切り替えることができるようにすること。私が取る機能を持っている私のビルドシステムでは

webpackConfig.resolve.alias: { 
    openlayers: 'openlayers/dist/ol-debug.js' 
} 

：これはデバッグバージョンを使用するようにopenlayersインポートを解決https://webpack.github.io/docs/configuration.html#resolve-alias

：

Answer 1

のWebPACKは異なるパスにモジュールを交換するための設定オプションがあります環境型を指定し、一致するwebpackConfigを返します。パラメータに基づいて、上記のスニペットが含まれているかどうかを確認します。 フルコード：webpack-multi-config.js

私は開発と生産の2つの異なる（gulp-）タスクを持っています。たとえば、生産タスク：webpackProduction.js
Line 1は、タイプとしてproductionの設定スクリプトをインポートします。

私のビルドシステムはgulp starterに基づいています。