You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

SvelteKit项目中./$types无PageLoad成员报错求助

解决SvelteKit中./$types无PageLoad导出的问题

在SvelteKit项目中,尝试从./$types导入PageLoad类型时出现TypeScript错误:

Module "./$types" has no exported member 'PageLoad'.ts(2305)

其他同类项目的./$types模块均包含该导出成员,以下是测试代码、配置文件及排查解决步骤:

测试代码

import { error } from '@sveltejs/kit';
import type { PageLoad } from './$types';

export const load: PageLoad = async ({ params, fetch }) => {
  console.log('props from +page.ts: ', params.db_item)
  // 通过Worker/Lambda获取数据
  return params.db_item
}

package.json配置

{
    "name": "test",
    "version": "0.0.1",
    "private": true,
    "scripts": {
        "dev": "vite dev",
        "build": "vite build",
        "preview": "vite preview",
        "test": "playwright test",
        "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
        "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
        "lint": "prettier --check .",
        "format": "prettier --write .",
        "surge deploy": "rollup -c; surge public"
    },
    "devDependencies": {
        "@playwright/test": "^1.25.0",
        "@sveltejs/adapter-auto": "next",
        "@sveltejs/kit": "next",
        "node-sass": "^7.0.3",
        "prettier": "^2.6.2",
        "prettier-plugin-svelte": "^2.7.0",
        "svelte": "^3.44.0",
        "svelte-check": "^2.7.1",
        "svelte-preprocess": "^4.10.6",
        "tslib": "^2.3.1",
        "typescript": "^4.7.4",
        "vite": "^3.1.0"
    },
    "type": "module",
    "dependencies": {
        "svelte-share-buttons-component": "^1.5.0"
    }
}

svelte.config.js配置

import adapter from '@sveltejs/adapter-cloudflare';
import preprocess from 'svelte-preprocess';

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

export default config;

排查解决步骤

  • 确认文件位置:load函数必须放在+page.ts文件中,PageLoad类型仅会在+page.ts同级目录生成的./$types中导出;如果是布局文件+layout.ts,对应的类型是LayoutLoad。
  • 执行类型同步:运行npm run check或单独执行svelte-kit sync命令,该命令会自动生成$types模块的类型定义文件。
  • 升级SvelteKit版本:当前使用的是next标记的开发版本,版本不稳定可能导致类型生成异常,建议升级到最新稳定版,修改package.json中@sveltejs/kit的版本号后执行npm install。
  • 检查TS配置:确保tsconfig.json中types数组包含"@sveltejs/kit",且include数组覆盖所有源码文件(例如"src/**/*")。
  • 重启开发服务器:类型生成后,需要重启Vite开发服务器才能让TypeScript识别新的类型定义。

内容的提问来源于stack exchange,提问作者Joel Hager

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.11 20:45:34