Nuxt3 使用 Typescript 给出无法找到模块“#imports”或其相应的类型声明

Question

我到处搜索为什么会发生这种情况，但没有结果。

在一个非常基本的组件中，这样做会给出：找不到模块“#imports”或其相应的类型声明

import { setPageLayout } from '#imports';

代码工作正常，但它与类型有关并且无法识别带有“#”的导入

我完成了文档中列出的所有配置。大家有什么想法吗？

ts配置：

{
  "compilerOptions": {
    "target": "ES2018",
    "module": "ESNext",
    "moduleResolution": "Node",
    "lib": [
      "ESNext",
      "ESNext.AsyncIterable",
      "DOM"
    ],
    "esModuleInterop": true,
    "allowJs": true,
    "sourceMap": true,
    "strict": true,
    "noEmit": true,
    "baseUrl": ".",
    "paths": {
      "~/*": [
        "./*"
      ],
      "@/*": [
        "./*"
      ]
    },
    "types": [
      "@nuxt/types",
      "@nuxt/typescript-build",
      "@types/node"
    ],
    "resolveJsonModule": true,
        "noImplicitAny": false,
  },
  "exclude": [
    "node_modules"
  ],
  "extends": "./.nuxt/tsconfig.json"
}

nuxt.config

import type { NuxtConfig } from '@nuxt/types';

const config: NuxtConfig = {
  buildModules: ['@nuxt/typescript-build'],
  vue: {
    config: {
      productionTip: false,
      devtools: true
    }
  }
};

export default config;

vue-shim.d.ts

declare module "*.vue" {
  import Vue from 'vue'
  export default Vue
}

Answer 1

终于明白了！

所以 Nuxt 无法识别“#imports”别名。要解决此问题，请将以下内容添加到 tsconfig.json 文件中：

{
  "compilerOptions": {
    "paths": {
      "#imports": [".nuxt/imports.d.ts"]
    }
  }
}

这立即解决了问题