Nuxt build error: TypeError: Cannot destructure property 'nuxt' of 'this' as it-CodePudding

I want to create a new Nuxt project and followed their instructions here: https://nuxtjs.org/docs/get-started/installation. Basically just running npm init nuxt-app@latest <project-name>.

After going through the setup (in which I choose Tailwind as my UI of choice), I run npm run dev and it crashes while trying to build saying "Cannot destructure property 'nuxt' of 'this' as it is undefined."

Here is the full stack:

 FATAL  Cannot destructure property 'nuxt' of 'this' as it is undefined.                                                                                                                                                      15:22:52  

  at postcss8Module (node_modules\@nuxt\postcss8\dist\index.js:15:10)
  at installModule (/C:/Users/conmi/Documents/Personal/Katie's Website/katierose-photos/node_modules/@nuxt/kit/dist/index.mjs:416:9)
  at async setup (/C:/Users/conmi/Documents/Personal/Katie's Website/katierose-photos/node_modules/@nuxtjs/tailwindcss/dist/module.mjs:186:7)
  at async ModuleContainer.normalizedModule (/C:/Users/conmi/Documents/Personal/Katie's Website/katierose-photos/node_modules/@nuxt/kit/dist/index.mjs:167: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)

I found not including '@nuxtjs/tailwindcss' in the buildModules in nuxt.config.js removes the error, but it does not create the tailwind config files I need. Also, the line causing the error in postcss8Module's index.js is const { nuxt } = this. For some reason this is undefined.

CodePudding user response：

The error comes from the recent Nuxt 3 Release and is being tracked on the create-nuxt-app Github.

Create-nuxt-app is not compatible with Nuxt 3 yet. Therefore, for now, you have to install Nuxt 3 and Tailwind CSS manually:

npx nuxi init <project-name>
cd <project-name>
npm install
npm install @nuxtjs/tailwindcss --save-dev

Now you should be able to run your app as expected:

npm run dev

CodePudding user response：

Hi sorry doesn't have enough rep to comment on this, but just wanted to say this issue is also being tracked at https://github.com/nuxt/framework/issues/9115 for Nuxt 2