レッスンのコードを一部変更したら正常に動作しなくなってしまいました。
なぜでしょうか。

変更箇所は以下の定数宣言を render() 関数の外にまとめて移動しました。
（それ以外は一切変更していません。）

  const main = document.querySelector('main');
  const section = document.createElement('section');
  const h2 = document.createElement('h2');
  const ul = document.createElement('ul');
  const li0 = document.createElement('li');
  const li1 = document.createElement('li');
  const li2 = document.createElement('li');

定数をグローバルスコープで宣言すれば関数スコープ内でも有効なので問題ないと思ったのですが、なぜうまくいかないのでしょうか。

理由がどうしてもわからず質問しました。main.js も念のため添付します。
お手数ですがご回答お願い致します。