本エントリーJavaScript Advent Calendar 2014 7日目の記事になります。 webpackとは 概要については最近いろんな方が書いてるいるのでそちらを参考にしていただければつかめるかと。 全部のせRequireJSっぽいWebpackを使ってみた。 RequireJS等はもう古い。WebPackとは？ ようはナウいフロントエンドの依存解決ツールですね。 っていうネタで書こうと思っていたら、昨日yutaponさんが既に書いていたりするので（gulp.jsを使ってフロントエンドのビルドをする【webpack, stylus】）、いいところはパクリ参考にしつつ、もうちょっとwebpackに突っ込んだ内容を書いてみようと思います。 Options entryとoutput 簡単に試すときはentryは1ファイルだけ指定できればよいですが、実際にプロジェクトで使うとなると複
webpackとは いろんなファイルをtranspileしてES5のJavaScriptに変換してくれるやつ AMDかCommonJSの形式でファイルをロード(CommonJSならrequire)すると、transpileしたファイルをロードしてくれる クライアント側のjsコードでもrequireを使用することができる assetとしてビルドして配布するイメージ コードが共用の場合、設定を変えることで素のrequireを利用するサーバー用コードと、webpackがpolyfillしたrequireを利用するクライアントコードとを別々に生成できる 全てがJavaScriptになる、画像やCSSも 画像は「Base64かFilePath」に CSSは「headにstyleを挿入するjsコード」に 特定のファイルをどのようにtranspileするかはpathマッチングでプラグイン形式で設定する
webpack とは webpack は WebApp に必要なリソースの依存関係を解決し、アセット（配布物）を生成するビルドツール（要するにコンパイラ）です。JavaScript だけでなく、CoffeeScript や TypeScript、CSS 系、画像ファイルなどを扱うことができます。 WebApp のビルドツールは Grunt や Gulp が有名です。これらは基本的に、ビルド手順をタスクという形で自ら定義する必要があり、フロントエンド開発に馴染みのない開発者にとっては敷居が高いものでした（少なくとも、自分はそうでした）。 webpack を使えば、Grunt も Gulp も必要ありません！覚えるべきことはほとんどありません。（必要なら）簡単な設定ファイルを書いて webpack コマンドを実行するだけです。 以下では基本的な使い方を見ていきます。 ※もちろん Grunt/G
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
