1

npm、Gulp、および browserify を使用して、アプリケーションの半自動ビルド パイプラインを作成しています。これは私が達成しようとしていることです:

  • スクリプトタグを介して含めることができるページ固有のファイルがあります(つまり、、page1.js... page2.js
  • ページ固有のスクリプト間で共有されているカスタム コードをcommon.js.
  • npm 経由でインストールされたベンダー ライブラリ (つまり、ブートストラップ、jquery) を に抽出しvendor.jsます。

アプリケーションで browserify と browserify-shim を組み合わせることができません。私のウェブページには、、、およびが含まれvendor.jscommon.jspage1.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

4

0 に答える 0