Search code examples
javascriptsassvuejs3sass-loaderwebpack-5

Error to load scss to Vue3 TypeError: this.getOptions is not a function


I try to load scss style file to the Vue3 project.

I use:

"@vue/cli": "^4.5.13",
"@vue/cli-service": "^4.5.13",
"@vue/compiler-sfc": "^3.0.11",
"sass": "^1.32.13",
"sass-loader": "^11.1.1",
"vue": "^3.0.11",
"vue-resource": "^1.3.4",
"webpack": "5.0.0"

and I have still the sale problem:

Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
TypeError: this.getOptions is not a function
      at Object.loader (/home/dev/src/my-app/node_modules/sass-loader/dist/index.js:25:24)

All is up to date and I have removed my node_modules and reinstaled them. Ihave removed also node-sass so I have only sass package.


Solution

  • I had the same mistake today

     "dependencies": {
        "core-js": "^3.12.1",
        "vue": "^3.0.11",
        "vuetify": "^2.5.1"
      },
      "devDependencies": {
        "@vue/cli-plugin-babel": "^4.5.13",
        "@vue/cli-plugin-eslint": "^4.5.13",
        "@vue/cli-service": "^4.5.13",
        "@vue/compiler-sfc": "^3.0.11",
        "babel-eslint": "^10.1.0",
        "eslint": "^6.8.0",
        "eslint-plugin-vue": "^7.9.0",
        "sass": "^1.34.1",
        "sass-loader": "^10.1.1",
        "vue-loader-v16": "^16.0.0-beta.5.4"
      },
    

    change from "sass-loader": "^12.0.0" to "sass-loader": "^10.1.1"

    run:

    rm -rf node_modules
    rm package-lock.json
    npm install
    

    for me it solved