next.js 在vscode中无法单击Nex.js模块路径别名

2cmtqfgy  于 2023-01-02  发布在  Vscode
关注(0)|答案(2)|浏览(162)

我正在尝试获取可在vscode中单击的模块路径别名

// Ctrl+click Working fine
import Layout from "src/components/layout/Layout";

// Not working
import SEO from "@components/SEO";

我的JSconfig.json文件

{
  "compilerOptions": {
    "jsx": "react",
    "baseUrl": ".",
    "paths": {
      "@components/*": ["/src/components/*"],
      "@sections/*": ["/src/sections/*"],
      "@assets/*": ["/src/assets/*"]
    }
  }
}

我什么办法都试过了,但没有成功

disho6za

disho6za1#

这是解决方案

{
  "compilerOptions": {
    "jsx": "react",
    "baseUrl": "./",
    "paths": {
      "@components/*": ["./src/components/*"],
      "@sections/*": ["./src/sections/*"],
      "@assets/*": ["./src/assets/*"]
    }
  }
}
wkyowqbh

wkyowqbh2#

在“转到定义”时也有同样的问题。最后我发现它对我不起作用,因为我在项目中同时有tsconfig.json和jsconfig.json。
当tsconfig.json存在时,似乎忽略了jsconfig.json中的别名设置。
因为我想逐步转换成Typescript的东西,但有很多.js文件,我保留了tsconfig.json,并添加"**/*.js""include"列表,所以它也看到.js文件。现在别名在vscode是可点击的。
tsconfig.json:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/components/*": [
        "components/*"
      ]
    }
  },
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx",
    "**/*.js"
  ]
}

相关问题