在SvelteKit项目中创建Supabase客户端文件时TypeScript报错原因

为啥会出这问题？ #

本质是TypeScript把你手动创建的.js文件当成了编译输入源，结果编译输出时又要生成同名文件，直接冲突了——毕竟SvelteKit默认会处理src目录下所有JS/TS文件，两边抢同一个文件名可不就报错了。

直接能用的解决办法 #

1. 把.js改成.ts（最推荐） #

既然用了TypeScript，直接创建supabaseClient.ts就行，TS会把它当成正常源码处理，不会有输入输出撞车的问题。示例代码：

import { createClient } from '@supabase/auth-helpers-sveltekit';
import { PUBLIC_SUPABASE_URL, PUBLIC_SUPABASE_ANON_KEY } from '$env/static/public';

export const supabase = createClient(
  PUBLIC_SUPABASE_URL,
  PUBLIC_SUPABASE_ANON_KEY
);

2. 让TS忽略这个JS文件 #

要是非要保留.js后缀，去项目根目录的tsconfig.json里，给exclude数组加上这个文件的路径：

{
  "exclude": [
    "src/lib/supabaseClient.js",
    "node_modules",
    ".svelte-kit",
    "build"
  ]
}

这样TS就不会把这个文件当成编译输入，自然就不会报覆盖的错了。

3. 检查SvelteKit配置有没有乱改 #

如果之前动过svelte.config.js里的kit.files配置，可能不小心把这个JS文件同时设成了输入和输出目标。直接重置成默认配置试试：

import adapter from '@sveltejs/adapter-auto';
import { vitePreprocess } from '@sveltejs/kit/vite';

/** @type {import('@sveltejs/kit').Config} */
const config = {
  preprocess: vitePreprocess(),
  kit: {
    adapter: adapter()
  }
};

export default config;

4. 清缓存试试玄学 #

有时候.svelte-kit或node_modules里的缓存会搞出奇怪的问题，删了这俩目录再重新装依赖、启动项目：

# Windows cmd
rmdir /s /q .svelte-kit node_modules
npm install
npm run dev

# PowerShell
Remove-Item -Recurse -Force .svelte-kit, node_modules
npm install
npm run dev

内容的提问来源于stack exchange，提问作者Gal Povsod