Laravel 開発: Laravel Mix を使用して CSS と JavaScript をコンパイルするにはどうすればよいですか?

Laravel は、開発者が Web アプリケーションを迅速に構築できるようにする人気の PHP 開発フレームワークです。 Laravel Mix は、開発者が CSS と JavaScript コードを簡単にコンパイルできるようにすると同時に、他のさまざまな機能もサポートする非常に便利なツールです。

この記事では、Laravel Mix の一般的な使用法と、Laravel Mix を使用して CSS と JavaScript をコンパイルする方法を紹介します。

Laravel Mix のインストール

Laravel Mix を使用する前に、まず Laravel が正常にインストールされていることを確認する必要があります。まだインストールされていない場合は、まず Laravel フレームワークをインストールする必要があります。次に、次のコマンドを使用して Laravel Mix をインストールします。

npm install laravel-mix --save-dev

Laravel Mix で Sass 以下をサポートする必要がある場合は、sass と の npm パッケージもインストールする必要があります。以下それぞれ。たとえば、Sass をインストールするコマンドは次のとおりです。

npm install sass --save-dev

さらに、Laravel Mix は他のいくつかの npm パッケージにも依存しており、Laravel Mix のインストール時に自動的にインストールされます。

Laravel Mix の設定

デフォルトでは、Laravel Mix は webpack.mix.js ファイル内の設定情報を検索します。 mix.js() や mix.sass() などの関数を使用して、Laravel Mix の構成を記述することができます。簡単な例を次に示します:

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

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');

上記のコードは、Laravel Mix に resources/js/app.js ファイルを public/js/app.js にコンパイルするように指示します。 , resources/sass/app.scss を public/css/app.css にコンパイルします。 public/js および public/css フォルダーは事前に作成しておく必要があることに注意してください。

Laravel Mix の開始

設定が完了したら、Laravel Mix を実行してコードのコンパイルを開始できます。ターミナルで次のコマンドを実行するだけです:

npm run dev

このコマンドは、すべての CSS ファイルと JavaScript ファイルを 1 つのファイルにコンパイルします。コンパイルが完了すると、public/css フォルダーと public/js フォルダーに生成されたファイルが表示されます。

Laravel Mix をデバッグモードで実行する必要がある場合は、次のコマンドを実行できます:

npm run watch

このコマンドは、すべての CSS ファイルと JavaScript ファイルの変更を監視し、保存時にコードを自動的に再コンパイルします。

結論

Laravel Mix は、開発者が CSS と JavaScript コードを簡単にコンパイルできるようにする非常に便利なツールであり、自動テスト、バージョン管理、およびその他のさまざまな機能もサポートしています。ブラウジング デバイス同期など期待されるコンパイル効果を実現するには、Laravel Mix を使用する前に正しく設定して起動する必要があることに注意してください。

以上がLaravel 開発: Laravel Mix を使用して CSS と JavaScript をコンパイルするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。