【Laravel】Laravel Mixにそこそこ複雑な仕事を任せる

著者:杉浦

【Laravel】Laravel Mixにそこそこ複雑な仕事を任せる

 Laravel MixはLaravelプロジェクト組み込みのwebpackラッパーです。webpackの基本的な設定やコンパイル用のスクリプトを準備しておいてくれる点とLaravel用のバージョニングやら環境変数やらと結びついている点が利点になります。普通に使う分には以下の様なコンパイル対象を宣言するだけで問題ないです。これだけで十分便利です。

const mix = require('laravel-mix');

mix.sass('src/app.sass', 'dist')
   .js('src/app.js', 'dist');

 しかしフロントエンド側の開発環境を凝ろうとするとこれだけでは少々不便です。vuejs/vue-clifacebook/create-react-appの様なフロントエンドに注力する開発環境を別途用意しSPAを作るやり方についての記事もググればまあまあ出てきます。SPAを作る時はLaravelをAPIに注力させます。
 Laravel Mixは前述の二種ほどでないにせよ、いくらか複雑なこともできます。ドキュメントはLaravelそのものとは別にあります。Laravel Mix
Laravel Mix Extensions
 とりあえずで使える広範なカスタマイズはwebpack本来のconfigを注入する方法で以下のコードの通りです。

mix.webpackConfig({
    resolve: {
        modules: [
            'node_modules',
            path.resolve(__dirname, 'vendor/laravel/spark/resources/js')
        ]
    }
});

Quick Webpack Configuration | Laravel Mix Documentation
 webpackConfig関数の中身にはwebpack.config.jsでexportされるobject同様のモノを入れればOKです。その様にすればLaravel Mix側でうまい具合にマージしてくれます。
Configuration | webpack
 Laravel自身バックエンド用ということもあり任せられる仕事は程々です。それぐらいはできるので気持ち複雑程度の課題ならばわざわざフロントエンド開発用フレームワークを用いるのでなくLaravel Mixで済ませたいです。

  • この記事いいね! (0)

著者について

杉浦 administrator