1

最新(この記事の執筆時点では 2.4.3)/vendorを使用して構築された EmberJS プロジェクトのディレクトリの下に ES6 ライブラリ "foo" があるとします。ember-clifoo が複数のファイル ( 、 など) を持つライブラリでbar.jsありbaz.js、それらすべてが何かをエクスポートするとします。

、などを取りvendor/foo/bar.js、vendor/foo/baz.jsそれらを配布ファイルにバンドルしたいと思います。たとえばvendor/foo/dist/foo-bundle.js、次のようにしてEmberにインポートできます。

app.import("vendor/foo/dist/foo-bundle.js");

これは、バンドラーおよび/またはトランスパイラー ( Babelなど) で可能であるように見えますが、どのツールをどの組み合わせで使用する必要があるかは明確ではありません。Ember には、ember-cli を介して私がやりたいことを行うための組み込みツールがありますか? webpack、browserify、またはrollupなどの外部バンドラーを使用する必要がありますか?

一般的に、JavaScript ツールの周りには多くのノイズがあるようで、この問題に対してどのような選択肢があり、それらを適切に活用する方法を理解するのが難しくなっています。どんな援助でも大歓迎です。

参考になりそうなメモ…

これまでにいくつかのことを試しました：

main.jsEmberJS が依存関係ツリーをたどり、ステートメントで参照された他のファイルをインポートすることを期待して、ファイルのインポートだけを試みましたimport。これはmain.jsファイルのみをインポートし、他の依存関係はインポートしませんでした。

broccoli-es6modulesを調べたところ、実行時にエラーが発生しましたが、ロールアップを支持して廃止された esperanto も使用しています。

また、ロールアップを直接使用してみましたが、成功の度合いはわずかでしたが、多くの場合、bundle.js出力が空で、bar.jsまたはbaz.jsからのコードが含まれていません。これは、エントリ ポイントにインポートしただけだからです (例main.js):

main.js
-------
import bar from './bar.js';
import baz from './baz.js';

bar.js
------
export default function bar() {
  ...
}

baz.js
------
export default function baz() {
   ...
}

main.jsコードを呼び出す関数が含まれているかbar、baz空のバンドル以上のものを取得しているかどうかを確認しましたが、foo がサードパーティ ベンダーからのスクリプトのコレクションであり、量を除けば、「アプリケーション エントリ ポイント」を持たない場合マニフェストファイルのようなものに、ロールアップは私が探しているものに対して間違った選択であるようです.

再度、感謝します！

4

1 に答える 1

3

(最新のオプションで更新されます。)

いくつかのオプションがあります。

  1. baz.jsとbar.jsが独自のモジュールとコードである場合は、それらをフォルダーに配置するのが最適ですapp/my-awesome-module。ES6インポートを使用して、それらを使用したい他の場所にインポートできます。Ember CLI は、それらを自動的に変換、連結、縮小します。

  2. サードパーティのモジュールまたはソリューションを使用したい場合は、http://emberobserver.comをチェックしてください。人気のあるライブラリのほとんどは既に Ember アドオンに変換されているため、ember install.

  3. プロジェクトで使用ember-auto-importし、次のように通常の ES6 モジュールとしてライブラリをインポートします。import MyCoolModule from "my-cool-module";

于 2016-04-13T07:28:59.193 に答える