Posted at

Vue CLI 3でCSSのSourceMapを有効にする

vue-cli-service serve してもデフォルトではCSSのSourceMapが無効になっていたので、有効化してみます。


方法

プロジェクトのルートディレクトリに以下のファイルを追加

vue.config.js

以下の内容を記述


vue.config.js

module.exports = {

css: {
loaderOptions: {
css: {
sourceMap: true,
},
postcss: {
sourceMap: true,
}
}
}
}


確認

Before

After


参考

https://cli.vuejs.org/config/#css-sourcemap

以上