複数の Browserify または Webpack バンドルで、NPM 経由で必要なコードを共有するための簡単なソリューションを探して、ここで私の髪を引っ張ります。考えてみると、ファイルの「ブリッジ」などはありますか?
これはコンパイル時間によるものではなく (watchify を認識しています)、ベンダー固有のライブラリをすべて抽出してvendor.js、ファイルサイズをapp.js抑え、大量のソースマップでブラウザーをクラッシュさせないようにしたいという願望によるものです。さらに、コンパイルされた js を表示する必要が生じた場合に、よりクリーンな方法であることがわかります。など：
// vendor.js
require('react');
require('lodash');
require('other-npm-module');
require('another-npm-module');
Bower ではなく NPM からコードをロードするか、相対パスを介してインポートして shim を介して識別できるように、「vendor」ディレクトリに保存することが非常に重要です。実際のアプリケーション ソースを除いて、すべてのライブラリ リファレンスを NPM 経由でプルしたままにしておきたいと思います。
すべてのソースコードを保持し、配列app.jsを介して、externals上記のベンダー ライブラリをコンパイルから除外します。
// app.js
var React = require('react');
var _ = require('lodash');
var Component = React.createClass()
// ...
ではindex.html、両方のファイルが必要です
// index.html
<script src='vendor.js'></script>
<script src='app.js'></script>
BrowserifyまたはWebpackを使用して、app.jsnpm経由でロードされたモジュールを「見る」ことができるようにするにはどうすればよいですか? 外部とのバンドルを作成し、エイリアスを介して直接ファイル (たとえば、node_modules) を参照することは認識していますが、より自動化され、「Require.js」のようなソリューションが少ないソリューションを見つけたいと考えています。
基本的に、依存関係を解決するためにapp.js内部を調べることができるように、2 つを橋渡しすることが可能かどうか疑問に思っています。vendor.jsこれは単純明快な操作のように思えますが、この広い広い Web のどこにも答えが見つからないようです。
ありがとう！