ES6 export / import

export

名前付き(1モジュールあたり複数もてる)

export と 宣言が同時

export let name1 = …, name2 = …, …; // var, const もOK
export function functionName(){...} // 末尾の;がない
export class ClassName {...} // 末尾の;がない

先に定義されたものをexport

export { name1, name2, … };
export { name1 as export_name1, name2 as export_name1, … }; // 名前をかえてexport

 規定(1モジュールあたり1つまで)

export と 宣言が同時

export default function () { ... } 
export default function functionName () { ... } 
export default class { .. }
export default class ClassName { .. }
export default {hoge:'fuga'}
export defautl ['hoge','fuga',,,]

先に定義されたものをexport

export { name1 as default};
export { name1 as default, name2, name3}; // ,で名前付きexportもつなげられる

import

規定exportされたものをimport

import myDefaultExport from "/modules/my-module.js";

名前付きでexportされたものをimport

import {name1} from "/modules/my-module.js";
import {name1,name2} from "/modules/my-module.js";

規定 export と 名前付き export も混在できるみたい

import myDefaultExport, { name1 [ , [...] ] } from "/modules/my-module.js";

すべてのexportをimport

import * as myModule from '/modules/my-module.js';
// myModule.name1 で呼び出せる
// default export は myModule.default となる(!)

名前付きexport もしくは default export の名前をかえる

import {name1 as short_name1, name2 as short_name2} from '/modules/my-module.js';
import {myDefaultExport as new_name} from "/modules/my-module.js"; // defaultだけimportするときにこの書き方はしないだろうが