microsoft / microsoft/TypeScript
Support go-to-definition on tsconfig mapped paths for non-source files
Nobody has claimed this yet.
- Dominant language
- Go
- Stars
- 111k
- Forks
- 14.4k
- Avg merge
- 1d 19h
- Merged PRs (30d)
- 117
Description
Suggestion
The recent change in TypeScript 4.3 to bring go-to-definition support on non-JavaScript file paths is fantastic! I’d love to see this functionality extended to mapped paths defined in tsconfig.json.
🔍 Search Terms
- go-to-definition (and “go to definition”)
- paths
- tsconfig
✅ Viability Checklist
My suggestion meets these guidelines:
- This wouldn't be a breaking change in existing TypeScript/JavaScript code
- This wouldn't change the runtime behavior of existing JavaScript code
- This could be implemented without emitting different JS based on the types of the expressions
- This isn't a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, new syntax sugar for JS, etc.)
- This feature would agree with the rest of TypeScript's Design Goals.
⭐ Suggestion
📃 Motivating Example
As of TypeScript 4.3,
import foo from "../styles/foo.css";
works well when using go-to-definition. This suggestion would make
import bar from "+styles/foo.css";
work just as well, opening up the underlying mapped file.
💻 Use Cases
This would be useful anywhere someone is using mapped paths in their tsconfig.json to shorten relative imports to commonly used directories (like a “styles” directory).
—
Here’s an example of how I imagine this working:
ts-gotodefs-example
├── package.json
├── src
│ ├── css.d.ts
│ └── index.ts
├── styles
│ └── foo.css
├── tsconfig.json
src/index.ts
// go-to-definition works, foo.css opens as of TS 4.3
import foo from "../styles/foo.css";
// this should also open foo.css but as of TS 4.3 it does not
import bar from "+styles/foo.css";
src/css.d.ts
declare module "*.css" {
const classes: { [key: string]: string };
export default classes;
}
tsconfig.json
{
"compilerOptions": {
"rootDir": "src",
"outDir": "lib",
"paths": {
"+styles/*": ["./styles/*"]
}
}
}
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the example in src/index.ts and its tsconfig.json paths mapping, using the css.d.ts declaration and styles/foo.css target to reproduce the current behavior. Done means go-to-definition resolves +styles/foo.css to the mapped file just as it does for ../styles/foo.css.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- devtools
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 35/100