Vue.jsでグローバルにスタイルを当てる [Sass]

課題

（１）宣言系・関数系をグローバルで呼びたい。
（２）reset.cssやcommon.cssもグローバルで呼びたい。
各vueファイルのstyleにimportするのは手間なため。

解決策 - (1)宣言系・関数系をグローバルで呼びたい。

以下の方法で、スタイルをグローバルに読むことが可能。

1. プロジェクトのあるディレクトリ直下に「vue.config.js」という名前のファイルを追加
2. 以下の記述を行う

vue.config.js

module.exports = {
  css: {
    loaderOptions: {
      sass: {
        data: `@import "@/assets/scss/global.scss";` //グローバルで読みたいファイル名
      }
    }
  },
  productionSourceMap: true, //これはmapファイルの生成有無。作りたくない場合はfalseでOK。
};

解決策 - (2)reset.cssやcommon.cssもグローバルで呼びたい。

以下の方法で、スタイルをグローバルに読むことが可能。

1. main.jsに以下の記述を行う

main.js

import "./assets/scss/common.scss";

最後に「npm serve」を再度行う。
↑★私よくこれ何度か忘れて、修正反映されてないなって陥ります