Posts tagged with webpack


その2から大分間が空いたけれどもその3。 とはいうもののその2でjquery方式のビルド方法分かったんだからそれ使えば終わりじゃないか。確かにそうだ、いやいや待ってほしい、よーく考えてほしい。 投稿してから時間空きすぎててもうあんまり覚えてないが、どう考えても一般人が気軽に行えるような内容ではない。なんで自作したjavascriptをさっとぱっと公開したいだけなのにあんな面倒なコーディングルールや環境構築をまるっと全て整備しなければいけないのか。 辿り着いた答えはwebpack。どちらかというとCommonJSよりのビルドツールだがAMDにも対応してくれる。 正直なところ初めからwebpack導入しておけば、CommonJSでもAMDでも好きな方で書いて最終的に1つのグローバル変数としてモジュールを吐き出すということが簡単にできる。 そしてwebpackだとAMD(あるいはCommonJS)の機能を含めた形でビルドしてくれるからrequire.jsのような外部jsファイルを読み込む必要がない。これが結構重要。 「このライブラリを使うにはrequire.jsが必要です。」 「このライブラリはscriptとして読み込むだけで使えます。」 ライブラリを使おうと思ってるページで既にrequire.jsを使っているならrequire.js必須と言われてもなんとかしてくれそうだが、そうでない大部分のページでは読み込むだけで使える方が楽に決まっている。 というわけでとにもかくにも実際に試してみたのがこちら。 言わずと知れたライフゲームを好きなところにポンッと設置するためだけのjavascriptモジュール。なんでライフゲームかと言うと最近みたライフゲーム動画が面白かったから。 対応ブラウザであればこの直下あたりに黒と緑の点滅するセル群が表示されているはず。 var init = function() {  var main = new LifeCanvas(…