2020/05/10追記
うまくいかず、、
hoge.jsでの変更が huga.jsに反映されませんでした。
定数の扱いになってしまうみたいで、
huga.jsの glogals.a は、10のまま。。
これを試しても、やはり同じ感じです。
https://webpack.js.org/plugins/provide-plugin/
webpackの仕様が変わったのか。
とりあえず、windowオブジェクトに名前空間用意するしかないかなぁ。。
誰か知っているかた、おしえてください！
jsファイル間で変数を共有したい時
その昔は、、、
globals.js
(function(){}(
window.common = {
a:10,
b:12
}
))();
a.js
(function(){}(
window.common = window.common || {}
window.common.a++;
console.log(window.common.a); // 11
))();
b.js
(function(){}(
window.common = window.common || {}
window.common.a++;
console.log(window.common.a); // 12
))();
index.html
<html>
<title>バンドルツール出る前の旧石器時代</title>
<head>
</head>
<body>
<script src="./globals.js">
<script src="./a.js">
<script src="./b.js">
</body>
こんなことしてた
webpack使った時
同じ事したい時、どうすればいいのか。
この記事を見て、実験してみたらうまいこといった。
ES6 Modules 間では export/import された変数（？）は同期される
globals.js
export default {
a:10,
b:15
};
module_hoge.js
import globals from './globals';
console.log(globals.a) // 10
globals.a++;
console.log(globals.a) // 11
module_huga.js
import globals from './globals';
console.log(globals.a) // 11
この方法は正しいのだろうか。
他にも色々ありそう。
https://stackoverflow.com/questions/37656592/define-global-variable-with-webpack