如何通过全局.scss文件而不是Vue中的main.js导入引导程序

Question

目前，我正在按以下方式导入引导程序：

import Vue from 'vue';
import App from './App.vue';
import router from './router';

import 'bootstrap'; // I want to transfer this
import 'bootstrap/dist/css/bootstrap.min.css'; // and this

Vue.config.productionTip = false;

new Vue({
  router,
  render: (h) => h(App),
}).$mount('#app');

是否可以按以下方式在全局scss文件上传输它？ ： vue.config.js

module.exports = {
  css: {
    loaderOptions: {
      sass: {
        prependData: `
            @import "@/style/main.scss";
        `,
      },
    },
  },
};

src / style / main.scss

@import '../../node_modules/bootstrap/dist/css/bootstrap.min.css';

body {
  background-color: #333;
}

@import上的示例不起作用，并导致错误“无法解析路径”。

之所以需要这样做，是因为我不必!important就使用main.scss来覆盖引导样式。看来main.scss是在main.js上引导导入之前执行的。