vscode“智能感知”和“转到定义”非 js/ts 文件

在前端开发中，我们经常不仅在 javascript 中导入 javascript/typescript 文件。我们使用别名和相对路径导入此类文件。

Example:

import brandsQuery from '~/graphql/queries/brands.gql';
import Button from '~/components/common/button/index.vue';
import Component from './list/index.vue';

默认情况下，当我们导入此类文件时，VS Code 不支持 js/ts 扩展名 - 此类文件没有“Intellisense”和“Go to Definitoon”。

我尝试过这样的扩展：路径智能感知 https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense and 路径自动完成 https://marketplace.visualstudio.com/items?itemName=ionutvmi.path-autocomplete

支持别名的 VS Code 设置：

  "path-intellisense.mappings": {
    "~/": "${workspaceFolder}",
  },

or

  "path-autocomplete.pathMappings": {
    "~/": "${folder}/",
  }

通过这些扩展，我们在编写导入字符串时可以自动完成。对于相对路径，“转到定义”也有效。

但“转到定义”不适用于使用别名导入的非 js-ts 文件。

您是否知道如何为我的项目中需要的所有扩展同时拥有“智能感知”和“转到定义”？

See https://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_57.md#go-to-definition-for-non-jsts-files https://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_57.md#go-to-definition-for-non-jsts-files

许多现代 JS 捆绑器和框架都使用import声明给 导入图像和样式表等资源。我们现在支持 浏览这些导入go to definition:

This is probably most useful when using ctrl/cmd click to navigate through your code.