経緯
js→tsへの移行をしているのだが、掲題の通り'x' is not defined
が発生していて、かなり悩んだ。。。
ts移行の記事は以下
内容
htmlからtsで定義したfunctionを呼び出しているのだが、呼び出せていない。
ソース
ts側
function showSettingModal() { ・・・ }
html側
<a class="dropdown-item" href="#" id="show message" onclick="showSettingModal()" >show text modal</a>
原因
typescriptに移行した実装は、即時実行関数でラッピングされるため、そのまま使おうとすると、参照スコープ外になり、参照できないため、'x' is not defined
が発生していた。。。
昔、typescriptやってた時も、そんなことあったなぁ~と思いながら、台パンした。
jsで動いていたソースで、変化がなかったので、問題なく動くはずだと思っていたが、ビルド結果で差異が出てくるの、マジできつい。。。
対応内容
window.showSettingModal = function showSettingModal() { ・・・ }
とりあえずwindowsに適当に加えたら動いた。
型定義で警告出てるから、その対応が必要だけど、とりあえず動かないからは前進できた。。。
参考サイト
javascriptのバンドルツールで詰まった | Octo's blog
雑記
最近、無性にキレやすくなってる気がする。。。
なんとかせねば。。。