JavaScriptで複数ライブラリを読み込んだら、関数名が重複してて動作しなくなった場合


When include some JavaScript libraries, the function names is duplicated and it does't work.

 

JavaScriptで複数の外部ライブラリを読み込んでたら、関数名やら変数名が重複してたようで、動作しなくなった。

 

ので、ライブラリに手を加えることになるけど(ついでにHTMLにも追記が必要になるけど)、解決した方法。
外部ファイルの中身を、ユニークな関数名をつけて囲って対応しています。

 

■ Javascript .jsファイル内 修正前 sample-code

  var aaa;
  function bbb(){
    ...
  }
  bbb();

 

 

■ Javascript .jsファイル内 修正後

const unique_fn_name1 = function() { // ★ユニークな関数名をつけて囲う add wrapping with unique name
    var aaa;
    function bbb(){
      ...
    }
    bbb();
} // ★囲う

 

■ HTMLに追記

  <script>
    unique_fn_name1(); // ★追記!! add
    // unique_fn_name2(); // ★同じ感じで追記
    // unique_fn_name3(); // ★同じ感じで追記
  </script>

 

The contents of the external js file are wrapped by unique function names.