jQueryを利用しない方式に変更
1.index.html
before:

<script src="lib/jquery-3.5.1.min.js"></script>

after:

無し

2. js/canvas.js
2.1 canvas上でのイベント
before:

    // canvas上でのイベント
    $("#canvas").mousedown(function(){
      globalThis.clickFlg = 1; // マウス押下開始
    }).mouseup(function(){
      globalThis.clickFlg = 0; // マウス押下終了
    }).mousemove(function(e){
      // マウス移動処理
      if(!globalThis.clickFlg) return false;
      root.draw(e.offsetX, e.offsetY, cnvBold, cnvColor);
    });

after:

       var canvas = document.getElementById("canvas");
       canvas.onmousedown = function(){
               globalThis.clickFlg = 1; // マウス押下開始
       }
       canvas.onmouseup = function(){
               globalThis.clickFlg = 0; // マウス押下終了
       }
       canvas.onmousemove = function(e){
               if(!globalThis.clickFlg) return false;
               root.draw(e.offsetX, e.offsetY, cnvBold, cnvColor);
       }

2.2 描画クリア
before:

    // 描画クリア
    $("#clear").click(function(){
      root.ctx.clearRect(0,0);
      root.setBgColor(bgColor);
    });

after:

       var clear = document.getElementById("clear");
       clear.onclick = function(){
               const cnvWidth = 500;
               const cnvHeight = 500;
               root.ctx.clearRect(0,0,cnvWidth,cnvHeight);
               root.setBgColor(bgColor);
       }

2.3 canvasを画像で保存
before:

    // canvasを画像で保存
    $("#download").click(function(){
      canvas = document.getElementById('canvas');
      var base64 = canvas.toDataURL("image/jpeg");
      document.getElementById("download").href = base64;
    });

after:

       var download = document.getElementById("download");
       download.onclick = function(){
               canvas = document.getElementById('canvas');
               var base64 = canvas.toDataURL("image/jpeg");
               document.getElementById("download").href = base64;
       }