How to fix @import scss in vue.js?

Question

Vue.js

I'm trying to migrate the template to Vue.js, but I'm getting an error importing scss files

App.vue

<style>
@import "./assets/scss/style.scss";
</style>

style.scss

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-overflow-scrolling: touch;
  text-decoration: none;
}

@import 'base/fonts';

_fonts.scss

body {
  background: #000;
}

If you remove "@import" in style.scss it will work without errors

The error itself

This dependency was not found:

* -!../../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!./base/fonts in ./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--6-oneOf-1-2!./src/assets/scss/style.scss

To install it, you can run: npm install --save -!../../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!./base/fonts

Answer 1

Why are you importing so strangely?
Right in index.jsimport "./assets/scss/style.scss";