close

[Solved] TypeError: this.getOptions is not a function in vue.js

Hello Guys, How are you all? Hope You all Are Fine. I am facing an error in vue.js when I installed bootstrap. TypeError: this.getOptions is not a function in vue.js. So Here I am Explain to you all the possible solution Here.

Without Wasting your time, Lets start This Article to Solve This Error in vue.js

How TypeError: this.getOptions is not a function in vue.js Occurs ?

I am facing an error in vue.js when I installed bootstrap. The error is below. I am using vue@2.6.12 and sass-loader@11.0.0.

Syntax Error: TypeError: this.getOptions is not a function


 @ ./node_modules/vue-style-loader??ref--8-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!./node_modules/vue-loader-v16/dist/stylePostLoader.js!./node_modules/postcss-loader/src??ref--8-oneOf-1-2!./node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/App.vue?vue&type=style&index=0&id=7ba5bd90&lang=scss 4:14-419 14:3-18:5 15:22-427
 @ ./src/App.vue?vue&type=style&index=0&id=7ba5bd90&lang=scss
 @ ./src/App.vue
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://192.168.1.182:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

Solutions

How to solve TypeError: this.getOptions is not a function in vue.js ?

Seems Like sass-loader@11.0.0 doesn’t working with vue@2.6.12. All you need to solve this error Just downgrade sass-loader version that will solve your Error. Just follow below step to solve this error.

PS : After upgrade sass-loader to latest version If using yarn can downgrade sass-loader use yarn add sass-loader@^10.1.1 it work.

Solution 1

Seems Like sass-loader@11.0.0 doesn’t working with vue@2.6.12. All you need to solve this error Just downgrade sass-loader version that will solve your Error. Just follow below step to solve this error. After upgrade sass-loader to latest version If using yarn can downgrade sass-loader use yarn add sass-loader@^10.1.1 it work.

downgrading sass-loader by setting

"sass-loader": "10.1.1",

in package.json. This Will Solve Your Error.

Solution 2

This solved for me, for similar problem with SASS:

  1. add to package.json in devDependencies: “sass-loader”: “7.3.1”,
  2. npm i -D sass
  3. remove node_modules
  4. npm install
  5. yarn intall

Here Is My Config File:

  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "sass": "^1.32.6",
    "sass-loader": "7.3.1",
    "vue-template-compiler": "^2.6.11"
  },

Solution 3

Just downgrade postcss-loader. This Will Also Resolve your error.

+ "postcss-loader": "^4.2.0",
- "postcss-loader": "^5.0.0",

Solution 4

This Solution will Also Work for you.

  1. upgrade sass-loader to latest version.
  2. downgrade sass-loader
  3. use yarn add sass-loader@^10.1.1

Summery

So it’s all About All possible solutions. Hope this above all solution helped you a lot. Comment below Your thoughts and your queries. Comment Below on your suggestion.

Also Read

Leave a Comment