mdn web docs や SAMURAI ENGINEER Blog をいくら読んでもピンと来なかったのですが、Qiita の記事を試してみたらうまく動かせました。

参考サイト

JavaScriptでのimport/export方法 | Qiita
https://qiita.com/koeri3/items/314ac7b9b73fc8c80a2d

import | mdn web docs
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/import

前提

記事の中にもありましたが、ES2015（ES6）とNode.js（CommonJS）では書き方が異なります。

ウェブ制作においては、読み込んだスクリプトをモジュールとして扱うので、ES2015（ES6）の書き方が有用そうです。

また、HTMLファイルに埋め込む時は、<script type=”module”></script> を指定しないとモジュールとして使えません。（エラーになります）

あと、インポートされたモジュールは Strictモードで動作します。

【使い方 1】エクスポートしたい関数を export文で指定する

export文を指定して関数を宣言すれば、その関数はエクスポートされる。

複数の関数をエクスポートしても、import文で {} 内でモジュールを指定してインポートすれば、まとめてインポートすることができる。

practice-01.html

<script src="./import-01.js" type="module"></script>

import-01.js

import { add, minus } from './export-01.js';
console.log( add(1, 2) );
console.log( minus(1, 2) );

export-01.js

export const add = (num1, num2) => {
  return num1 + num2;
};

export const minus = (num1, num2) => {
  return num1 - num2;
};

【使い方 2】

practice-02.html

<script src="./import-02.js" type="module"></script>