Adarsh
Adarsh

Reputation: 524

Getting error in scss file when installing vuetify.js

I have installed vuetify.js but it's giving me error in webpack configuration.

I have changed my webpack v4 configuration, also installed node-sass and sass-loader

Webpack.config.js

{
    test:  /\.(s*)css$/,
    loader:['style-loader', 'css-loader', 'sass-loader']
}

This is the error

ERROR in ./node_modules/vuetify/src/styles/main.sass 3:0 Module parse failed: Unexpected character '@' (3:0) You may need an appropriate loader to handle this file type. | // Modeled after ITCSS https://www.xfive.co/blog/itcss-scalable-maintainable-css-architecture/ |

@import './settings/_index' | @import './tools/_index' | @import './generic/_index' @ ./node_modules/vuetify/lib/framework.js 5:0-33 @ ./node_modules/vuetify/lib/index.js @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/header/Header.vue @ ./src/header/Header.vue @ ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/app/App.vue @ ./src/app/App.vue @ ./src/index.js

Upvotes: 3

Views: 5486

Answers (2)

Omri Maher
Omri Maher

Reputation: 171

did you add this lang="scss" to your tag ? when you use scss you should have this format of style tag

<style lang="scss" scoped>...</style>

Upvotes: 0

Simon Thiel
Simon Thiel

Reputation: 3285

I use the following installed the following dependencies and it works fine for me:

    "sass": "^1.22.9",
    "sass-loader": "^7.2.0",
    "vue-cli-plugin-vuetify": "^0.5.0",
    "vuetify-loader": "^1.3.0"

Upvotes: 3

Related Questions