类型错误：找不到“主题”的类型定义文件。该文件位于程序中是因为： 隐式类型库“主题”的入口点

Question

我正在构建一个 NextJs 项目 构建时出现以下错误，

我尝试了以下方法

1. 删除

   .next

   文件夹并尝试再次编译
2. 删除了

   node_modules

   和

   package-lock.json

   文件，然后重试

收到此错误（运行 npm run build 后的终端日志）

 - Environments: .env.local

   Creating an optimized production build ...
 ⨯ Failed to find font override values for font `Protest Guerrilla`
 ⨯ Failed to find font override values for font `Protest Guerrilla`
 ✓ Compiled successfully
   Linting and checking validity of types  ..Failed to compile.

Type error: Cannot find type definition file for 'theme'.
  The file is in the program because:
    Entry point for implicit type library 'theme'

包.json

{
  "name": "app_name",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@emotion/cache": "^11.13.1",
    "@emotion/react": "^11.13.3",
    "@emotion/styled": "^11.13.0",
    "@flaticon/flaticon-uicons": "^3.3.1",
    "@mui/icons-material": "^6.1.2",
    "@mui/material": "^6.1.2",
    "@mui/material-nextjs": "^6.1.2",
    "@tanstack/react-query": "^5.59.9",
    "axios": "^1.7.7",
    "next": "14.2.14",
    "next-auth": "^4.24.8",
    "react": "^18",
    "react-dom": "^18",
    "react-hook-form": "^7.53.0"
  },
  "devDependencies": {
    "@tanstack/eslint-plugin-query": "^5.59.7",
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "@typescript-eslint/eslint-plugin": "^7.18.0",
    "@typescript-eslint/parser": "^7.18.0",
    "eslint": "^8",
    "eslint-config-airbnb": "^19.0.4",
    "eslint-config-airbnb-typescript": "^18.0.0",
    "eslint-config-next": "14.2.14",
    "eslint-config-prettier": "^9.1.0",
    "eslint-plugin-prettier": "^5.2.1",
    "prettier": "^3.3.3",
    "typescript": "^5"
  }
}

tsconfig.json

{
  "compilerOptions": {
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "bundler",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "paths": {
      "@/*": ["./src/*", "./src/theme/*"]
    },
    "typeRoots": ["./node_modules/@types", "./src/app/types"],
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts", "src/app/types/theme/theme.d.ts", "src/app/types/**/*.ts"],
  "exclude": ["node_modules"]
}

Answer 1

找到解决方案了，

这是我遵循的步骤

1. 更新打字稿
2. 由于我通过添加自定义断点修改了默认 MUI 主题，因此我已在单独的模块文件中明确定义了它的类型。
3. 在

   tsconfig

   中添加了显式文件路径，如下所示

"paths": {
     "@/*": ["./src/*", "./src/app/types/theme/*"]
   },