vue cli, проверяющий css из консоли разработки браузера

Question

Следуя различным примерам vue cli, чтобы успешно внедрить файл scss в файл vue, теперь страница загружается с импортированным css, но я не могу проверить, с какого номера файла / строки приходит объявление css, все, что он говорит в консоли chrome, находится внутри консоли.не из фактического файла, такого как "margin.scss line 40".

вот мой vue.config.js

module.exports = {
  pluginOptions: {
    'style-resources-loader': {
      preProcessor: 'scss',
      patterns: ["@/src/css/index.scss"]
    }
  },

вот мой App.vue

<template>
  <div >

  </div>
</template>


<style lang="scss" >
  @import "./css/index.scss";
</style>

и вот что я вижу,

Answer 1

Активировать исходные карты:

module.exports = {
  css: {
    sourceMap: true,
  },
  pluginOptions: {
    'style-resources-loader': {
      preProcessor: 'scss',
      patterns: ["@/src/css/index.scss"]
    }
  },

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