vue3新建项目出现的问题

问题一：

TS2792    (TS) 找不到模块“xxx”。你的意思是要将 "moduleResolution" 选项设置为 "node"，还是要将别名添加到 "paths" 选项中?   

TS6046    (TS) “--moduleResolution”选项的参数必须为 'node', 'classic', 'node16', 'nodenext'。

原因：是解析策略之前是Bundler

解决方案：

（1）把tsconfig.json和tsconfig.node.json中的moduleResolution改成node

问题二：TS2307    (TS) 找不到模块“./App.vue”或其相应的类型声明。   

原因：在ts项目里面，.ts文件是识别不了.vue文件

解决方法：

（1）项目根目录创建一个env.d.ts的文件编写以下内容

/// <reference types="vite/client" />
 
 

declare module '*.vue' {
    import { DefineComponent } from 'vue';
    // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
    const component: DefineComponent<{}, {}, any>;
    export default component;
}
 
// 环境变量 TypeScript的智能提示
interface ImportMetaEnv {
    VITE_APP_TITLE: string;
    VITE_APP_PORT: string;
    VITE_APP_BASE_API: string;
}
 
interface ImportMeta {
    readonly env: ImportMetaEnv;
}

 （2）在tsconfig.json中include解析这个xxx.d.ts文件

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "useDefineForClassFields": true,
    "moduleResolution": "node",
    "strict": true,
    "jsx": "preserve",
    "sourceMap": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "lib": ["esnext", "dom"],
    "baseUrl": "./",
    "paths": {
      "@": ["src"],
      "@/*": ["src/*"]
    }
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.d.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "*.ts"
  ],
  "references": [{ "path": "./tsconfig.node.json" }]
}

问题解决

问题三：TS5023    (TS) 未知的编译器选项“allowImportingTsExtensions”。   

原因：该选项用于控制是否允许在 import 语句中导入 .ts 文件扩展名，它的取值可以是 true 或 false。但是，从 TypeScript 3.8 开始，这个选项已经被废弃了

解决方法：删除allowImportingTsExtensions