Я пытался добавить глобальные переменные s css в мой Vue проект. Я нашел этот пример Глобально загрузить sass . Поэтому я создал vue.config.js в своей папке root своего проекта Vue, затем скопировал и вставил vue.config.js и изменил путь к данным, а затем, когда я пытаюсь обслуживать свой проект, я получаю эту ошибку:
ValidationError: Недопустимый объект параметров. Sass Loader был инициализирован с использованием объекта параметров, который не соответствует схеме API. - у параметров есть неизвестное свойство data. Эти свойства действительны: объект {реализация ?, sassOptions ?, prependData ?, sourceMap ?, webpackImporter? } при проверке
Я проверил package.json, чтобы убедиться, что я установил node-sass и sass-loader, и нашел следующие зависимости:
"devDependencies": {
"@vue/cli-plugin-babel": "^4.1.0",
"@vue/cli-plugin-router": "^4.1.2",
"@vue/cli-service": "^4.1.0",
"babel-eslint": "^10.0.3",
"node-sass": "^4.12.0",
"sass-loader": "^8.0.0",
"vue-template-compiler": "^2.6.10"
}
Итак, я Я немного сбит с толку, и я не знаю, что я делаю неправильно. Я также знаю, что могу импортировать эти .scss переменные в каждый vue компонент, в котором я собираюсь их использовать, но мне не нравится это решение.
vue .config. js
module.exports = {
css: {
loaderOptions: {
sass: {
data: `
@import "@/style/index.scss";
`
}
}
}
};
Структура каталогов
