【Laravel Mix】ソースマップを出力する設定方法|Sass・JavaScript

今回は、Laravel MixでSass・JavaScriptなどをコンパイルした際に、ソースマップを出力する設定方法となります。
また、今回の例ではLaravel Mix をすでにインストールしている前提としています。Laravel Mix のインストール方法などについては、以下のリンク先を参考にしてみてください。
【Laravel Mix】Sass・JavaScriptのソースマップを出力する設定方法
Laravel Mixでは、設定をwebpack.mix.jsファイルで管理します。
以下、webpack.mix.jsに、ソースマップを出力する.sourceMaps()メソッドを追加した設定例となります。
const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css')
.sourceMaps(true, 'inline-source-map');
上記のように.sourceMaps()メソッドを追記して保存後、以下のnpm-scriptsのコマンドを実行します。
それにより、ファイルを監視して、ファイルが更新されたら自動でコンパイルを行い、その際にソースマップを出力します。
npm run watch
以上が、Sass・JavaScriptなどをコンパイルした際に、ソースマップを出力する設定方法となります。
また、.sourceMaps()メソッドの詳細については、文末の参考サイトを確認してみてください。