Rollup.jsでIntl.jsモジュールを使用する方法

Question

Angular 2typescript 2のコードはthe Intl.js polyfillです。

をtsconfig.jsonに設定して、Rollup.jsをrecommended by Angularとして使用してツリーシェイクを可能にしました。私のコンポーネントで、私はちょうどimport 'intl'

私は、ブラウザでアプリケーションを実行しない場合、私はes2015

rollup.configにライブラリを変換するためにrollup-plugin-commonjsを使用してみましたが、エラー

global is not defined

を取得します.js

plugins: [ 
     nodeResolve({jsnext: true, module: true}), 
     commonjs({ 
      include: 'node_modules/intl/**/*', 
     }) 
] 

ブラウザでアプリを実行すると、行で

IntlPolyfill is not defined

：

IntlPolyfill.__addLocaleData({locale:"en-US",...});

I noticed hereそれはrollupと互換性がありますので、ライブラリはes6で書かれていることを示すエラートン。どのようにこのライブラリをes6モジュールとして使用するためのヒント？

Answer 1

ES6モジュールとしてIntl.jsを使用するには、distフォルダ（例えばIntl.esm.jsなど）内の他のファイルと一緒にESモジュールのバージョンを公開するメンテナを説得

1. に必要があると思いますいずれか、package.jsonでmoduleとjsnext:mainフィールドを使用して - 彼らはすでに自分のUMDが同じバベルを使用するように注意しながら、src内のファイルを使用して、それを自分でビルドするので、これは些細な追加となり構築、または
2. 生成するプログラムのロールアップを使用しています設定等

あなたはになります。は、現在の形式でrollup-plugin-commonjsを使用して使います。

import 'intl/dist/Intl.js'; 
console.log(Intl); // works! 

：それはあなたがちょうどあなたが（おそらく彼らはESモジュールにどのように働くかにCommonJSで異なる動作をするいくつかのトリッキーな循環的な依存関係に） index.jsファイルではなく dist/Intl.jsファイルをインポートしていることを確認する必要があり判明します

index.jsは、distファイルがESモジュールから直接生成されるため（bloaty CommonJS変換なし）、効果があってもインポートするよりも良い結果が得られます。