ESModulesの、export default と export の違い

• export defaultは1つのみ、exportは複数の変数を渡すことができる。

export default の場合

• モジュール側
  modules.mjs

  const getAge = () => {
      return 18;
  }
  export default getAge;
  

• モジュールを呼ぶ側
  modules.mjs

  import getAge from './modules.mjs';
  console.log(getAge());
  

export の場合(複数渡せるが1つでも渡せる)

• モジュール側
  modules.mjs

  const getAge = () => {
      return 18;
  }
  export { getAge };
  

• モジュールを呼ぶ側
  modules.mjs

  import { getAge } from './modules.mjs';
  console.log(getAge());
  

export の場合(複数渡せる)

• モジュール側
  modules.mjs

  const getName = () => {
      return 'hoge';
  }
  const getAge = () => {
      return 18;
  }
  export { getName, getAge };
  

• モジュールを呼ぶ側
  modules.mjs

  import { getName, getAge } from './modules.mjs';
  console.log(getAge());
  console.log(getName());