Search code examples
vue.jssassstyles

use sass styles globally in Vue.js


I tried to use sass globally in the vue.js app using this method :

const { defineConfig } = require('@vue/cli-service')
module.exports = {
    css:{
        loaderOptions:{
            sass:{
                data:`@import "@/sass/test.scss";`
            }
        }
    }
}

but in vue.config.js i have these 2 lines of code:

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({transpileDependencies: true})

I've tried to put a comma between them and it didn't work, I've also tried to remove the first two lines and it won't work, I've searched but all the results were old,


Solution

  • Alright, I've figured it out, go to your main.js and import your main sass file (or whatever files you have) and it'll work just fine.