我有关于VS代码自动完成和警告消息(红色摇摆线)的问题.在为TypeScrip文件中的导入指定绝对路径时,IntelliSense向我发出错误警告.我使用Tauri和Svelte作为框架.

我制作了以下用于调试问题的简单文件:

src/my_app.ts:

import { my_value } from "@folder/my_test_file"

src/my/test/folder/my_test_file.ts:

export let my_value = 8;

tsconfig.json:

{
  "extends": "@tsconfig/svelte/tsconfig.json",
  "compilerOptions": {
    "moduleResolution": "Node",
    "target": "ESNext",
    "useDefineForClassFields": true,
    "module": "esnext",
    "resolveJsonModule": true,
    "allowSyntheticDefaultImports": true,
    /**
     * Typecheck JS in `.svelte` and `.js` files by default.
     * Disable checkJs if you'd like to use dynamic types in JS.
     * Note that setting allowJs false does not prevent the use
     * of JS in `.svelte` files.
     */
    "allowJs": true,
    "checkJs": true,
    "isolatedModules": true,
    "baseUrl": "./",
    "paths": {

      "@folder/*": [
        "src/my/test/folder/*"
      ],

      "@src/*": [
        "src/*"
      ]
    },

  },
  "include": ["src/**/*.d.ts", "src/**/*.{svelte,ts,js}"],
  "exclude": ["node_modules"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

我的目录:

enter image description here

package.json:

{
  "name": "piping-system-solver",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview",
    "check": "svelte-check --tsconfig ./tsconfig.json",
    "tauri": "tauri"
  },
  "devDependencies": {
    "@sveltejs/vite-plugin-svelte": "^1.0.0-next.30",
    "@tauri-apps/cli": "^1.0.0-rc.13",
    "@tsconfig/svelte": "^2.0.1",
    "svelte": "^3.44.0",
    "svelte-check": "^2.2.7",
    "svelte-preprocess": "^4.9.8",
    "tslib": "^2.3.1",
    "typescript": "^4.5.4",
    "vite": "^2.9.9"
  },
  "dependencies": {
    "@tauri-apps/api": "^1.0.0-rc.6",
    "autoprefixer": "^10.4.7",
    "module-alias": "^2.2.2",
    "postcss": "^8.4.14",
    "split-grid": "^1.0.11",
    "svelte-drag-and-drop-actions": "^1.0.0",
    "tailwindcss": "^3.1.0",
    "vite-tsconfig-paths": "^3.5.0"
  }
}

以下扩展的版本:

  • VS代码的Svelte:v106.1.0
  • 打字英雄:v3.0.0

在文件src/my_app.ts中(和我的所有其他.ts文件中类似),TypeScrip在上面的代码行中不断发出以下警告:

"Cannot find module '@folder/my_test_file' or its corresponding type declarations."

...即使代码可以编译和工作.当键入绝对路径时,这也会影响代码完成.但是,在我的.svelte文件中指定绝对路径时,不会出现此警告,并且代码完成可以正常工作.

以下是所有值得提及的试验、 idea 和观察的 list :

  1. 相对路径是可行的,包括汇编和智商建议.
  2. 所有的svelte文件都可以通过指定绝对路径来完美地工作(import { my_value } from "@folder/my_test_file"在.svelte文件中没有错误,而IntelliSense建议使用子文件夹).
  3. 我试过"重启TS服务器",但无济于事.
  4. 我看了this question本书,里面有很多关于如何解决这个问题的建议,但没有一个对我管用.
  5. 我已经安装了打字英雄.
  6. 我已经安装了从this link开始的vite-tsconfig-路径
  7. 我观察到,IntelliSense警告和建议根据tsconfig.ts文件中的更改动态更新,而实际的程序只在关闭和重新打开窗口时更新(NPM运行Tauri dev).
  8. 在.svelte文件中指定绝对路径是有效的,即使您删除tsconfig.json中的"paths"配置,不保留路径别名.它的工作原理是从"src"开始(例如"src/some/path/file").看起来Svelte内置了别名"src"这条路?
  9. (新的)我现在注意到,在.svelte文件中,当开始双引号时,会建议更多的东西(.js文件、.ts文件、.json文件,其中还有文件夹),而在我的.ts文件中,只有模块被建议(根据this,建议前面的图片).

我也很想知道,这是否可能是Tauri,Svelte ogTypescript 中的一个错误.

推荐答案

这不是个窃听器.看起来你的配置有问题.实现目标的步骤:

  1. 将"src/*.ts"添加到tsconfig.json中的include数组中.
  2. 将别名添加到vite.config.ts:'@folder/': fileURLToPath(new URL('./src/my/test/folder/', import.meta.url))

vite.config.ts应如下所示:

import { fileURLToPath, URL } from 'node:url';
import { defineConfig } from 'vite';
// https://vitejs.dev/config/
export default defineConfig({
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url)),
      '@folder/': fileURLToPath(new URL('./src/my/test/folder/', import.meta.url))
    },
  },
});

使用您提供的tsconfig.jsonpackage.json的最小工作示例项目:https://stackblitz.com/edit/github-xg6eei?file=README.md.注意:我不能排除您的本地配置有其他问题(类型脚本项目配置很复杂),但您可以从上面链接的示例工作项目配置向后工作.

Typescript相关问答推荐

在Angular中,如何在文件上传后清除文件上传文本框

有没有可能使用redux工具包的中间件同时监听状态的变化和操作

无法绑定ngModel.条件ngSwitchCase中的错误

如何根据特定操作隐藏按钮

通配符路径与每条路径一起显示

如何判断对象是否有重叠的叶子并产生有用的错误消息

如何在已知基类的任何子类上使用`extends`?

TypeScrip:从对象中提取和处理特定类型的键

@TANSTACK/REACT-QUERY中发生Mutations 后的数据刷新问题

接受字符串或数字的排序函数

为什么特定的字符串不符合包括该字符串的枚举?

有没有办法传递泛型类型数组,以便推断每个元素的泛型类型?

如何解决&Quot;类型不可分配给TypeScrip IF语句中的类型&Quot;?

为什么在这种情况下,打字脚本泛型无法正确自动完成?

KeyOf关键字在特定示例中是如何工作的

三重融合视角与正交阵

如何在Next.js和Tailwind.css中更改悬停时的字体 colored颜色

在对象数组中设置值

Angular 16:无法覆盖;baseUrl;在tsconfig.app.json中

Typescript 和 Rust 中跨平台的位移数字不一致