問題タブ [rollupjs]

私はAngular2プロジェクトに取り組んでいます。Angular2 aot ドキュメントを調べたところ、ngFactory ファイルを生成できました。ドキュメントで提案されているように、ロールアップ js を使用しました。es6 以外の npm パッケージがいくつかあります。es6 以外のパッケージをロードするために require を使用しました。

ドキュメント (angular2 およびロールアップ) では、es6 以外のモジュールをバンドルするために rollup-plugin-commonjs を使用することが提案されています。以下は私のロールアップ構成です。

私はcommonjsプラグインを用意しています。しかし、それでもブラウザは「require is undefined」というエラーを出します。webpack/browserifyの助けを借りずに es6 以外のモジュールをバンドルする方法を教えてください。

私はAngular2アプリケーションに取り組んでいます。ドキュメントを読み、AOT とロールアップを実装しました。アプリケーションに es6 以外のモジュールがいくつかあります。ロールアップ後、webpack を使用して js をバンドルし、「require」ステートメントを必要なライブラリ コードに置き換えます。すべてのステップで sourceMap を生成しましたが、それでもコンソールにエラーが表示された場合、正しい行が反映されません。以下は、私の aot、ロールアップ、および webpack の構成です。「sourceMap」オプションは、各構成で「true」に設定されています。お知らせ下さい。

tsconfig.aot.js

ロールアップ.ts

そして最後にWebpack

プラグイン: [

]、

angular 2 プロジェクトを AoT でコンパイルしようとしています。しかし、私は次の問題を抱えています。

ソースコードは次のとおりです。

rollup.config.js

NGC を使用してプロジェクトをコンパイルしてからロールアップすることはできますが、ロールアップによって bluebird モジュールが {..., default: 'actual bluebird'} に変換されるため、getEvents が呼び出されるとエラーがスローされます。

誰でも助けてもらえますか？

webpack でコンパイルされたプロジェクトを取得しましたが、すべて正常に動作しますが、rollupJS に移行していて、インポートされたファイルに悩まされています。

ユーティリティ/init-jquery.jsx :

このファイルは、たとえばこのファイルapp.jsxにインポートされます。

...

コンソール chrome: Uncaught ReferenceError: global is not defined(…)でこのエラーに悩まされました。

私のロールアップ構成:

まず、衝突を避けるために、rollup.jsが特定の変数の最後に余分な文字列を追加する必要がある理由を理解していますが... amd/ではない単純なjavascriptファイルを「連結/インポート」する方法がわかりませんcommonjs/es6、しかし単純な明らかにモジュール!

次のファイル構造があります。

foo.js

bar.js

main.js

構築後、私は得ました：

build.js

では、 Foo$1 の代わりに Foo を取得するにはどうすればよいですか? または、 bar.js の Foo の代わりに Foo$1 ですか?

編集：

場合によっては、main.js で、ビューでデフォルトのインポートを使用してデフォルト名をオーバーライドします。

次のようなエラーが発生しました（通常！）：

存在しないエクスポート 'default' は、main.js によって foo.js からインポートされます

それは誤解ですが、stackoverflow とインターネットを調査した結果、このトリッキーな問題を解決する方法については何も見つかりませんでした。

ですから...よろしくお願いします！

バベルに特定のインポートを無視するように指示する方法はありますか。たとえば、バベルにポリフィルなどの es5 インポートに触れさせたくないなどです。

除外オプションを試しましたが、何もしません。これが私の開発依存関係です：

また、ここに私の index.js と、babel に無視してもらいたいことを示すコメントがあります。

これどうやってするの？これに対処するために別のパッケージが必要ですか?

どんな助けでも大歓迎です、ありがとう。

私は Angular 2 アプリケーションのプロダクション ビルドに取り組んでおり、パッケージ サイズを縮小するために Angular 2 AoT ビルド プロセスを使用しようとしています (ドキュメントはこちら) 。

aot コンパイラ CLI とロールアップ CLI を介してビルドが機能し、期待どおりの出力が得られました。私のbundle.jsファイルは〜2kです。付随するソース マップ ファイルがあります。わーい！

次に、ロールアップを既存の gulp ビルドに組み込んでみました。ソース マップがバンドル内でインライン化されて 2MB を超えることを除いて、すべてが機能します。さらに、ソース マップ ファイルも生成されます。インライン ソース マップを手動で削除すると、バンドルのサイズが 2k まで減少します。

私の質問は、インライン ソース マップなしで bundle.js を生成するにはどうすればよいですか?

私が試したこと: SO の検索、Angular2 docs、 rollup -stream docs、およびgulp-sourcemap docs の精査。この問題に具体的に対処するものは見つかりませんでした。

以下は、関連する構成ファイルです

AoT 固有の tsconfig ファイル(tsconfig-aot.json):

ロールアップ構成（destおよびsourceMapFileファイルパスをコメントアウトして、それがgulpをオフにしているかどうかを確認しようとしましたが、効果はありませんでした）：

そしてgulpファイル：

編集： CLIでgulp実行ロールアップを行うことで回避策を見つけました。ただし、gulpまたはrollup構成で何が間違っているのかを知りたいです。

StackOverflow の質問Grid モジュールで指定された Telerik Grid モジュールとロールアップ設定を使用すると、「orderBy」を取得できません。GridModule、SharedModule、IntlService などの他のモジュールは解決されています。

ここに私の名前付きエクスポートがあります：