webpackでビルドしたbundle.jsの関数をonclickで動かしたかった話。

webpackでビルドしたbundle.jsの関数をonclickで動かしたかった話。:

久々にjsを直接書く機会が偶々あって、「webpackとかなにこれめっちゃ便利じゃん」とか思って使ってみたらindex.jsに定義してるはずの関数をonclickで呼ぼうとするとnot definedになったので解決方法の記録

【やりたかったこと】

index.html

<input type="button" value="送信" onclick="hoge()"/> 

これをクリックしたときに↓を動かしたかった

index.js

function hoge() { 
    console.log("ウオアアアアアアア"); 
}; 

とりあえず試したらnot definedとか言われたので、bundle.js開いてみたらそもそも定義した関数が存在してないっていうｗ

【解決法】

index.js

var hoge = function hoge() { 
    console.log("ウオアアアアアアア"); 
}; 
 
//↓こいつが必要みたい 
window.hoge = hoge; 

↓でもできるんじゃね？って思ったけど、多分またしばらくjs書かないので試しませんでした。

index.js

window.hoge = function a() { 
    console.log("ウオアアアアアアア"); 
};