jspm関連でEC6を使おうとしたけど、moduleの管理の仕方いろいろあってどうすればいいのかわからなかったので調べた。 SystemJSを使ってブラウザでもEC6のコードを利用できます。
SystemJSのI/Fで利用
ファイルをimportする
<script src="system.js"></script> <script> System.import("runtime-hoge"); </script>
ファイルをimportして処理を行う
<scirpt src="system.js"></script> <script> System.import("promise-hoge").then((hoge) => { // exportした`hoge`が引数に渡される console.log(hoge); }); </script>
pollyfillを使う
<scirpt src="system.js"></script> <script type="module"> import {hoge} from 'hoge'; console.log(hoge); </script>
Polyfillを使ったmoduleシステムの利用
名前付きでエクスポート
fuga.js:
export var fuga = 'hoge';
index.js:
import {fuga} from 'fuga'; console.log(fuga); // hoge
名前付きでエクスポート
fuga.js:
var fuga = 'hoge'; export {fuga};
index.js:
import {fuga} from 'fuga'; console.log(fuga); // hoge
名前を指定しないでエクスポート
fuga.js:
export default var fuga = 'hoge';
index.js:
import fuga from 'fuga'; console.log(fuga); // hoge
エクスポートしないでcodeだけ実行する
fuga.js:
console.log('fuga');
index.js:
import 'fuga'; // fuga