Nuxt•4mo ago

"Cannot write file '...' because it would overwrite input file" error in tsconfig.json

Hello. I created a Nuxt app with bunx nuxi@latest init www-nuxt. I added t3-env/nuxt and then I added TailwindCSS following their Nuxt guide. I went ahead to add a simple route in the server and a page in the client.

tree --gitignore
.
├── app.config.ts
├── app.vue
├── assets
│   └── css
│       └── main.css
├── components
├── env
│   ├── client.ts
│   └── server.ts
├── layouts
├── nuxt.config.ts
├── package.json
├── pages
│   └── index.vue
├── public
│   └── favicon.ico
├── README.md
├── server
│   ├── api
│   │   └── hello.ts
│   └── tsconfig.json
├── tailwind.config.js
└── tsconfig.json

10 directories, 14 files

tree --gitignore
.
├── app.config.ts
├── app.vue
├── assets
│   └── css
│       └── main.css
├── components
├── env
│   ├── client.ts
│   └── server.ts
├── layouts
├── nuxt.config.ts
├── package.json
├── pages
│   └── index.vue
├── public
│   └── favicon.ico
├── README.md
├── server
│   ├── api
│   │   └── hello.ts
│   └── tsconfig.json
├── tailwind.config.js
└── tsconfig.json

10 directories, 14 files

// server/api/hello.ts
export default defineEventHandler(() => {
  return "Hello";
});

// server/api/hello.ts
export default defineEventHandler(() => {
  return "Hello";
});

// pages/index.vue
<script setup lang="ts">
const data = await useFetch("/api/hello");
</script>

<template>
  <pre> {{ data }}</pre>
</template>

// pages/index.vue
<script setup lang="ts">
const data = await useFetch("/api/hello");
</script>

<template>
  <pre> {{ data }}</pre>
</template>

This runs fine with bun dev, however, I keep getting an error in server/tsconfig.json:

Cannot write file '/home/shig07770/Programming/ts-devkit/projects/www-nuxt/tailwind.config.js' because it would overwrite input file.ts

. However, this file only contains:

{
  "extends": "../.nuxt/tsconfig.server.json"
}

{
  "extends": "../.nuxt/tsconfig.server.json"
}

I tried removing the .nuxt directory and then regenerating the files with bun dev but the error is still there. This is also not a VS Code issue because it didn't go away when I reloaded the window.

5 Replies

🌺🇫🇷 Shigu :3 🌺•4mo ago

Reproducing the error - Run bunx nuxi@latest init nuxt-tsconfig-bug - Which package manager would you like to use? bun - Initialize git repository? No - Run cd nuxt-tsconfig-bug - Run bun add -D tailwindcss postcss autoprefixer && bunx tailwindcss init - Write nuxt.config.ts

export default defineNuxtConfig({
  devtools: { enabled: true },
  postcss: {
    plugins: {
      tailwindcss: {},
      autoprefixer: {}
    }
  }
});

export default defineNuxtConfig({
  devtools: { enabled: true },
  postcss: {
    plugins: {
      tailwindcss: {},
      autoprefixer: {}
    }
  }
});

- Write tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./components/**/*.{js,vue,ts}",
    "./layouts/**/*.vue",
    "./pages/**/*.vue",
    "./plugins/**/*.{js,ts}",
    "./app.vue",
    "./error.vue"
  ],
  theme: {
    extend: {}
  },
  plugins: []
};

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./components/**/*.{js,vue,ts}",
    "./layouts/**/*.vue",
    "./pages/**/*.vue",
    "./plugins/**/*.{js,ts}",
    "./app.vue",
    "./error.vue"
  ],
  theme: {
    extend: {}
  },
  plugins: []
};

- Observe error in server/tsconfig.json

Reagan M•3mo ago

Hi @🌺🇫🇷 Shigu :3 🌺 , have you found the solution?

🌺🇫🇷 Shigu :3 🌺•3mo ago

Reagan M•3mo ago

In my case it's the Eslint with .mjs suffix that is causing the issue. And I don't think it is recommended to change the .mjs to .ts(unsure) so as a temporary solution, I had to exclude it in the ~server/tsconfig.json like this.

{
  "extends": "../.nuxt/tsconfig.server.json",
  "exclude": ["../eslint.config.mjs"]
}

{
  "extends": "../.nuxt/tsconfig.server.json",
  "exclude": ["../eslint.config.mjs"]
}

In your case, I think the reason for that is the tailwind.config.js Try changing it to.ts

🌺🇫🇷 Shigu :3 🌺•3mo ago

Thanks, I'll try when I get home

Gaming

Programming

"Cannot write file '...' because it would overwrite input file" error in tsconfig.json