From 2cb1e8ffc4b4b1c4fb48fb977f3063231e98f5bc Mon Sep 17 00:00:00 2001 From: Nobuo Kihara Date: Wed, 18 Feb 2015 07:47:51 +0900 Subject: [PATCH] docs/guide-ja/structure-assets.md - updated [ci skip] --- docs/guide-ja/structure-assets.md | 52 +++++++++++++++++++++++++++++++ 1 file changed, 52 insertions(+) diff --git a/docs/guide-ja/structure-assets.md b/docs/guide-ja/structure-assets.md index 62048bc431e..f90dc438df7 100644 --- a/docs/guide-ja/structure-assets.md +++ b/docs/guide-ja/structure-assets.md @@ -588,3 +588,55 @@ yii asset assets.php config/assets-prod.php > Info|情報: `asset` コマンドを使うことは、アセットの結合・圧縮のプロセスを自動化する唯一の選択肢ではありません。 優秀なタスク実行ツールである [grunt](http://gruntjs.com/) を使っても、同じ目的を達することが出来ます。 + + +### アセットバンドルをグループに分ける + +場合によっては、全ての JavaScript と CSS のファイルを一つに圧縮することが良い選択肢にならないことがあります。 +例えば、あなたのアプリケーションがフロントエンドとバックエンドに分れていて、それぞれが自分専用の JavaScript と CSS のファイルを持っていると想像して下さい。 +このような場合に全てのファイルを一つに結合することは、余分なネットワークトラフィックを発生させるため、合理的ではありません。 +フロントエンドにアクセスするときに、バックエンドのファイルのソースコードもロードされることになります。 +逆の場合もまた同じです。 + +`asset` コマンドを実行するときに、二つ以上のターゲットバンドルを指定して、バンドルをグループ化することが出来ます。 +どのバンドルをどのグループに圧縮するかを指定するためには、ターゲットバンドルの構成情報の `depends` キーを使います。 +一つに結合すべきバンドルのクラス名を `depends` キーに列挙するだけで良いのです。 +ターゲットバンドルのうちの一つは、`depends` キーを空にしておくことが出来ます。 +そうすれば、そのターゲットバンドルが残りのソースバンドルの全てを含むことになります。 + +そのような構成情報は次のようなものになります。 + +```php +return [ + ... + // 出力されるバンドルをグループ化する + 'targets' => [ + 'allShared' => [ + 'js' => 'js/all-shared-{hash}.js', + 'css' => 'css/all-shared-{hash}.css', + 'depends' => [ + // バックエンドとフロントエンドで共有される全てのアセットを含める + 'yii\web\YiiAsset', + 'app\assets\SharedAsset', + ], + ], + 'allBackEnd' => [ + 'js' => 'js/all-{hash}.js', + 'css' => 'css/all-{hash}.css', + 'depends' => [ + // バックエンドだけのアセットを含める + 'app\assets\AdminAsset' + ], + ], + 'allFrontEnd' => [ + 'js' => 'js/all-{hash}.js', + 'css' => 'css/all-{hash}.css', + 'depends' => [], // 残りのアセット全てを含める + ], + ], + ... +]; +``` + +> Note|注意: ソースのアセットバンドルの依存関係に気を付けてください。 + 注意しないと、独立させたはずのターゲットバンドルが実際にはお互いに依存しあっている、ということになり得ます。