tailwindcss: Cannot start nuxt: Cannot read properties of undefined (reading 'push')

also, adding an empty array named devServerHandlers to nuxt.config file will solve the issue.

devServerHandlers: [],

I had this error after upgrading nuxt3 to RC 13. I manually updated @nuxt/tailwindcss from 6.1.1 to 6.1.3 and it fixed it.

Adding devServerHandlers: [] to nuxt.config.ts did not fix this for me. This was working yesterday, and I just booted my project up today to find it no longer working 😕

This issue is not related to nuxt-community/tailwindcss-module module itself. It’s error in @nuxt/kit implementation. They missed type safe assignment. I was able to get rid of this issue by making this patch

diff --git a/node_modules/@nuxt/kit/dist/index.mjs b/node_modules/@nuxt/kit/dist/index.mjs
index 120b935..a4912df 100644
--- a/node_modules/@nuxt/kit/dist/index.mjs
+++ b/node_modules/@nuxt/kit/dist/index.mjs
@@ -103,7 +103,11 @@ function addServerHandler(handler) {
   useNuxt().options.serverHandlers.push(handler);
 }
 function addDevServerHandler(handler) {
-  useNuxt().options.devServerHandlers.push(handler);
+  let nuxt = useNuxt()
+  if (!nuxt.options.devServerHandlers) {
+    nuxt.options.devServerHandlers = [];
+  }
+  nuxt.options.devServerHandlers.push(handler)
 }

 async function checkNuxtCompatibility(constraints, nuxt = useNuxt()) {

@pi0 I’ve got the same error when upgrade from 5.0.4 to 5.1.2 on both Nuxt2 and Nuxt3, here’s a stack trace of this error.

On Nuxt2

 FATAL  Cannot read properties of undefined (reading 'push')                                                  

  at addDevServerHandler (node_modules/@nuxt/kit/dist/index.mjs:106:38)
  at setup (node_modules/@nuxtjs/tailwindcss/dist/module.mjs:107:7)
  at async ModuleContainer.normalizedModule (node_modules/@nuxt/kit/dist/index.mjs:583:5)
  at async ModuleContainer.addModule (node_modules/@nuxt/core/dist/core.js:239:20)
  at async ModuleContainer.ready (node_modules/@nuxt/core/dist/core.js:51:7)
  at async Nuxt._init (node_modules/@nuxt/core/dist/core.js:478:5)

On Nuxt3

 ERROR  Cannot start nuxt:  Cannot read properties of undefined (reading 'push')                                                    

  at addDevServerHandler (node_modules/@nuxtjs/tailwindcss/node_modules/@nuxt/kit/dist/index.mjs:106:38)
  at setup (node_modules/@nuxtjs/tailwindcss/dist/module.mjs:107:7)
  at async Object.normalizedModule (node_modules/@nuxtjs/tailwindcss/node_modules/@nuxt/kit/dist/index.mjs:583:5)
  at async installModule (node_modules/@nuxt/kit/dist/index.mjs:392:3)
  at async initNuxt (node_modules/nuxt/dist/index.mjs:1319:7)
  at async load (node_modules/nuxi/dist/chunks/dev.mjs:6734:9)
  at async Object.invoke (node_modules/nuxi/dist/chunks/dev.mjs:6777:5)
  at async _main (node_modules/nuxi/dist/cli.mjs:46:20)

This also happened when fresh install the module as well.

Combination of nuxt 3.0.0 with @nuxtjs/tailwindcss 6.x fixed problem for me.

I had this error after upgrading nuxt3 to RC 13. I manually updated @nuxt/tailwindcss from 6.1.1 to 6.1.3 and it fixed it.

This is the exact solution.

"nuxt": "3.0.0-rc.13" "@nuxtjs/tailwindcss": "^6.1.3",

This did the trick for me.

also, adding an empty array named devServerHandlers to nuxt.config file will solve the issue.

devServerHandlers: [],

This work!! Thank youuuuuuuuu

I had this error after upgrading nuxt3 to RC 13. I manually updated @nuxt/tailwindcss from 6.1.1 to 6.1.3 and it fixed it.

This is the exact solution.

"nuxt": "3.0.0-rc.13" "@nuxtjs/tailwindcss": "^6.1.3",

Leaving this here for anyone else that may need it;

  /**
   * Temporary workaround for @nuxt-community/tailwindcss-module.
   *
   * Reported: 2022-05-23
   * See: [Issue tracker](https://github.com/nuxt-community/tailwindcss-module/issues/480)
   */
  devServerHandlers: [],

Thanks @yulafezmesi for the workaround

Be sure to use nuxt ^3.0.0 and nuxtjs/tailwindcss ^6.1.3, also, follow the official installation guide: https://tailwindcss.com/docs/guides/nuxtjs#3

"devDependencies": {
    "@nuxtjs/tailwindcss": "^6.1.3",
    "autoprefixer": "^10.4.13",
    "nuxt": "^3.0.0",
    "postcss": "^8.4.19",
    "tailwindcss": "^3.2.4"
  }

The same issue still exists, I solved it by downgrading to v5.0.0 the issue appears after v5.0.0, So I assume all the >= v5.0.1 and v5.1.x will have the same issue. Not to fall behind with the changes I will accept changes from ^5.2.x which is not available yet and hopefully, it will be fixed by then.

"devDependencies": { ...., "@nuxtjs/tailwindcss": "5.0.0||^5.2.x", ...., },

Downgraded from edge channel (rc-13) to rc-12, this fixed it for me

I have tried that, it caused other issues.

Any hope you can provide a reproduction or better stack trace of the error?

Im experiencing the same problem, have setted up this reproductions

also, adding an empty array named devServerHandlers to nuxt.config file will solve the issue. devServerHandlers: [],

Thank you! How did you know? Is this something one can find in the documentation?

devServerHandlers is nitro’s option used for register server routes on dev mode which @nuxtjs/tailwindcss generated via tailwind viewer.

src/module.ts from module’s repo

// Add _tailwind config viewer endpoint
if (nuxt.options.dev && moduleOptions.viewer) {
  const route = '/_tailwind/'
  const createServer = await import('tailwind-config-viewer/server/index.js').then(r => r.default || r) as any
  const { withoutTrailingSlash } = await import('ufo')
  const _viewerDevMiddleware = createServer({ tailwindConfigProvider: () => tailwindConfig }).asMiddleware()
  const viewerDevMiddleware = (req, res) => {
    if (req.originalUrl === withoutTrailingSlash(route)) {
      res.writeHead(301, { Location: withTrailingSlash(req.originalUrl) })
      res.end()
    }
    _viewerDevMiddleware(req, res)
  }
  addDevServerHandler({ route, handler: viewerDevMiddleware })
  nuxt.hook('listen', (_, listener) => {
    const fullPath = `${withoutTrailingSlash(listener.url)}${route}`
    logger.info(`Tailwind Viewer: ${chalk.underline.yellow(fullPath)}`)
  })
}

But for some reason, addDevServerHandler() give an error (unless you use nuxt-3.0.0-rc.3) because of devServerHandlers is not an Array. So we have to add devServerHandlers: [] to fix this.