npm run devで「TypeError: this.getOptions is not a function」
今回はNuxt.jsで開発を行っているときにnpm run dev時に下記のエラーが起きたときの原因と対処法についてご紹介していきます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
ERROR Failed to compile with 1 errors friendly-errors 6:13:42 AM ERROR in ./layouts/error.vue?vue&type=style&index=0&id=d5ea9138&lang=stylus&scoped=true friendly-errors 6:13:42 AM Module build failed (from ./node_modules/stylus-loader/dist/cjs.js): friendly-errors 6:13:42 AM TypeError: this.getOptions is not a function at Object.stylusLoader (/usr/local/test/node_modules/stylus-loader/dist/index.js:12:24) friendly-errors 6:13:42 AM @ ./node_modules/thread-loader/dist/cjs.js??ref--8-oneOf-1-0!./node_modules/vue-style-loader??ref--8-oneOf-1-1!./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-2!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??ref--8-oneOf-1-3!./node_modules/stylus-loader/dist/cjs.js??ref--8-oneOf-1-4!./node_modules/vue-loader/lib??vue-loader-options!./layouts/error.vue?vue&type=style&index=0&id=d5ea9138&lang=stylus&scoped=true 4:14-393 15:3-20:5 16:22-401 @ ./layouts/error.vue?vue&type=style&index=0&id=d5ea9138&lang=stylus&scoped=true @ ./layouts/error.vue @ ./.nuxt/index.js @ ./.nuxt/client.js @ multi ./node_modules/eventsource-polyfill/dist/browserify-eventsource.js (webpack)-hot-middleware/client.js?reload=true&timeout=30000&ansiColors=&overlayStyles=&path=%2F__webpack_hmr%2Fclient&name=client ./.nuxt/client.js |
Nuxt.jsのバージョンは2.18.1となります。
npm run devで「TypeError: this.getOptions is not a function」
対処法について結論をまず言うと、私の場合はstylus-loaderというライブラリを使用しておりましたが、これをダウングレードしたらエラーが出なくなりました。
具体的には、stylus-loaderを8.1.1から4.3.3へダウングレードするとうまくいきます。
おそらくですが、webpackの4系がstylus-loaderの4系に対応しているのだと思われます。
同じエラーが起きた方は、環境について確認してみてください。
終わりに
今回はNuxt.jsで開発を行っているときにnpm run dev時に冒頭のエラーが起きたときの原因と対処法についてご紹介いたしました。