How to use sass in VUE application?
You can use style-resources-loader plugin like this in vue.config.js file
vue.config.js
const path = require('path');module.exports = { ... pluginOptions: { 'style-resources-loader': { preProcessor: 'scss', // load which style file you want to import globally patterns: [path.resolve(__dirname, './src/styles/_variables.scss')], }, }};Edit: if this doesn't work, add this to your webpack.config module.rules array. It will tell webpack to use sass loader for your .scss files
{ test: /\/.scss$/, loaders: ['style', 'css', 'sass']}
After a lot of searching and trying different solutions I have found this article and following it step by step has worked perfect for me.Only by installing the file-loader and adding the highlighted fields in the article to my webpack I have solved the problem.
I leave you the link in case someone is in the same situation.
https://chriscourses.com/blog/loading-fonts-webpack
Thank you for your help.