"nuxt.options._layers is not iterable" error. What to do ? First day with vue.js

Asked 12/1 at 14:6 Answered 12/2 at 18:17

I am totally new to vue.js and I got this error while trying to launch my first npm run dev :

nuxt error : nuxt.options._layers is not iterable

I can't find any help about this anywhere. What to do ? I created a codesandbox here :https://codesandbox.io/p/github/amapic/vuetest Thanks

Espinoza answered 12/1 at 14:6 Comment(3)

Your repro does not work. Also why are you using Nuxt2 (end of life, use Nuxt3). As a whole, why do you eve use with a meta-framework? Start slow and read VueJS' documentation for a few hours before using Nuxt. – German 12/1 at 15:41

It's because of chatgpt. It didn't tell me about Nuxt3 – Espinoza 12/1 at 16:10

Don't expect things to be done well with ChatGPT. – German 12/1 at 16:41

I encountered the exact same error after going from node 16 to node 20 and having @nuxtjs/tailwindcss being updated form v5.0.0 to v5.3.5.

FATAL  nuxt.options._layers is not iterable
 at installModule (node_modules/@nuxt/kit/dist/index.mjs:2409:32)
 at async setup (node_modules/@nuxtjs/tailwindcss/dist/module.mjs:92:7)
 at async ModuleContainer.normalizedModule (node_modules/@nuxt/kit/dist/index.mjs:2112:17)
 at async ModuleContainer.addModule (node_modules/@nuxt/core/dist/core.js:167:20)
 at async ModuleContainer.ready (node_modules/@nuxt/core/dist/core.js:34:7)
 at async Nuxt._init (node_modules/@nuxt/core/dist/core.js:344:5)

I checked the Github repo (https://github.com/nuxt-modules/tailwindcss) and found out that v6 is available (6.11 already at time of writing).

So I switched to @nuxtjs/tailwindcss v6 and this error was gone:

$ yarn add --dev @nuxtjs/tailwindcss@^6

$ npm install --save-dev @nuxtjs/tailwindcss@^6

Barnette answered 29/1 at 14:3 Comment(3)

Just Googled TypeError: nuxt.options._layers is not iterable and came here to find my own answer. Lol ;D This solution worked once again though – Barnette 3/9 at 8:35

If you like me uses Yarn you can run the same command like this: yarm add -D @nuxtjs/tailwindcss@^6 – Vinylidene 2/11 at 7:15

Thanks @ola! I've updated my answer to include the yarn example too – Barnette 4/11 at 9:42

just update tailwind-css to: npm install --save-dev @nuxtjs/tailwindcss@^6

Albinaalbinism answered 12/2 at 18:17 Comment(1)

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center. – Chump 14/2 at 15:20

In my case the generated nuxt 2 project had a "@nuxtjs/tailwindcss": "^5.3.3", added automatically, and the error was thrown by one of its dependencies.

I downgraded this dependency to "@nuxtjs/tailwindcss": "^4.0.0" and my project is running now.

Mountainous answered 22/1 at 11:10 Comment(0)

Recommended topics

Hot tags