npm、Gulp、および browserify を使用して、アプリケーションの半自動ビルド パイプラインを作成しています。これは私が達成しようとしていることです:
- スクリプトタグを介して含めることができるページ固有のファイルがあります(つまり、、
page1.js...page2.js) - ページ固有のスクリプト間で共有されているカスタム コードを
common.js. - npm 経由でインストールされたベンダー ライブラリ (つまり、ブートストラップ、jquery) を に抽出し
vendor.jsます。
アプリケーションで browserify と browserify-shim を組み合わせることができません。私のウェブページには、、、およびが含まれvendor.jsてcommon.jsいpage1.jsます。ページを読み込もうとすると、スクリプトがしようとするとrequire('bootstrap')、ここで例外がスローされます。
// Part of bootstrap.js
if (typeof jQuery === 'undefined') {
throw new Error('Bootstrap\'s JavaScript requires jQuery')
}
ブートストラップがjqueryに依存していること、jqueryのエクスポートがjQuery変数にバインドされることを期待していることをbrowserify-shimに伝える必要があると思います。package.json でこれを実行しようとしました。
何が問題なのかを正確に特定するのに苦労しています。jquery:jQueryブートストラップのシム ( 、jquery:$、 )に入るために値のさまざまな順列を試しましたがjquery、役に立ちませんでした。browserまた、パスにさまざまな値を含めたり省略したりしてみました。また、コマンド ラインを使用してベンダー バンドルをビルドしようとしました: を使用し./node_modules/.bin/browserify -r jquery -r bootstrap > vendor.jsましたが、同じエラーがブラウザーに表示されます。browserify-shim と factor-bundle について多くの質問が寄せられていますが、この 2 つを組み合わせようとしている人には対応していません。
ここで問題を示すリポジトリを作成しました。インストールと再現の手順は README に記載されています。https://github.com/linkleonard/browserify-shim-factor-bundle