At least one <template> or <script> is required in a single file component

[jeydi243]

Environment

Hi everyone,
This is my environment

• Operating System: Windows_NT
• Node Version: v16.17.1
• Nuxt Version: 3.5.3
• Nitro Version: 2.4.1
• Package Manager: npm@8.15.0
• Builder: vite
• User Config: modules, runtimeConfig, postcss, app, devtools
• Runtime Modules: @nuxtjs/tailwindcss@6.7.2, @vueuse/nuxt@9.13.0, @pinia/nuxt@0.4.11
  Thank you for your help

Reproduction

To reproduce the error you can

1. clone this repo : https://github.com/jeydi243/gesi-nuxt
2. Install npm i
3. npm run build

It's just a simple nuxtjs project.

Describe the bug

In my project when i run the command npm run build the commande end with error show in logs.
It's should run normally.

Additional context

No response

Logs

This is console output: 
ERROR  [vite:vue] At least one <template> or <script> uired in a single file component.
file: C:/Users/g20861/Desktop/B/gesi-nuxt/node_modules/nuxt/dist/aponents/nuxt-root.vue


[21:40:59]  ERROR  At least one <template> or <script> is required
single file component.

  at Object.parse$2 [as parse] (node_modules\@vue\compiler-sfc\dis-vue/dist/index.mjs:2273:34)
  at Object.transform (/C:/Users/g20861/Desktop/B/gesi-nuxt/node_modules/@vitejs/plugin-vue/dist/index.mjs:2794:16)
  at /C:/Users/g20861/Desktop/B/gesi-nuxt/node_modules/rollup/dist/es/shared/node-entry.js:24899:40

[tobychidi]

This is because you may have created an empty .vue file in the pages directory

[jeydi243]

Hi @tobychidi
I look in my project and no .vue file are empty. You can look in the repo.

[wilsonpinto]

@jeydi243 I took the time to check your project and looks like there is couple of issues with your project that are not a Nuxt issue.

In general, there is some issues with your imports. For Vue, Nuxt already do that for you https://nuxt.com/docs/guide/concepts/auto-imports#vue-auto-imports.

Also, please check the debugging section https://nuxt.com/docs/guide/going-further/debugging#debugging-in-your-ide to fix the issues of your application, because if you cannot run dev you also will not be able to build.

[danielroe]

I don't encounter this issue when building your project: see https://stackblitz.com/github/jeydi243/gesi-nuxt and run npm run build. Maybe you have a .gitignored file in your pages/ directory?

[jeydi243]

Hi @wilsonpinto,

I fix some issues but can you use the main branch to launch now.

[NozomuIkuta]

@danielroe

I could reproduced his bug in my local by the following steps:

1. Run npx nuxi@latest init <app-name>

2. Add vite.config.js in the project root with content:

   import vue from '@vitejs/plugin-vue';
   
   export default {
       plugins: [
           vue()
       ]
   };

Note I stopped to dig into this issue at this point, because I believe this is not how Nuxt is supposed to be used.
JFYI, Nuxt succeeded in building the app with the code below:

import vue from '@vitejs/plugin-vue';

export default {
    plugins: [
        // vue()
    ]
};

---

@jeydi243

You don't have to create vite.config.js in Nuxt project.
Instead, you can define a subset of Vite configuration in nuxt.config.js.

See https://nuxt.com/docs/api/configuration/nuxt-config#vite for more detail.

[danielroe]

@NozomuIkuta is absolutely right here. 👍

I think maybe we could add a validation step to warn users if a custom vite config is present (and set a config option to disallow to being used, if vite supports that).

[jeydi243]

Thank you @NozomuIkuta @danielroe it's work.

[Foddie2]

Works for me. thanks @danielroe