Как добавить загрузчик sass для модулей node_modules в vue .config. js - PullRequest
Новая
       52

Как добавить загрузчик sass для модулей node_modules в vue .config. js

2 голосов
/ 21 апреля 2020

Я пытаюсь использовать sass loader для узловых модулей. Но независимо от того, что я пытаюсь, возникает следующая ошибка:

SassError: Не удается найти таблицу стилей для импорта.

My vue .config. js выглядеть так: 

module.exports = {
    css: {
        sourceMap: true,
        loaderOptions: {
            scss: {
                prependData: `
          @import "~@/my-node-module/theme/engine.scss"; 
        `
            }
        }
    },
};

1 Ответ

2 голосов
/ 21 апреля 2020

Попробуйте, из документов : 

@import "~my-node-module/theme/engine.scss";

~ сообщает Webpack, что путь импорта не является относительным путем.

@ является псевдонимом Vue CLI 3+ для каталога src.

Таким образом, ~@ по существу совпадает с @. В любом случае, Webpack знает, что путь не является относительным, и проверяет каталог src, и не находит модуль узла.

~ сам по себе заставляет Webpack искать в другом месте, обычно node_modules.

Проект .scss файл

Если у вас есть .scss актив в вашем каталоге src > assets > scss, например, вы можете сделать это: 

@import '@/assets/scss/variables.scss';

Или это: 

@import '~@/assets/scss/variables.scss';

или даже это: 

@import '~/../src/assets/scss/variables.scss';
...