microsoft / microsoft/TypeScript
Module Resolution: imports with JSON assertion should not need flag when module is esnext
Nobody has claimed this yet.
- Dominant language
- Go
- Stars
- 111k
- Forks
- 14.3k
- Avg merge
- 1d 19h
- Merged PRs (30d)
- 117
Description
Demo Repo
https://github.com/tminuscode/resolve-json-module
Which of the following problems are you reporting?
The module specifier resolves at runtime, but not at build time
Demonstrate the defect described above with a code sample.
import htmlTags from 'html-tags/html-tags.json' assert { type: 'json' }
const keys = Object.keys(htmlTags)
Run tsc --showConfig and paste its output here
{
"compilerOptions": {
"target": "es2020",
"module": "esnext",
"moduleResolution": "node16"
},
"files": [
"./index.ts"
]
}
Run tsc --traceResolution and paste its output here
Sorry, content too long
Paste the package.json of the importing module, if it exists
{
"name": "resolve-json-module",
"dependencies": {
"html-tags": "^3.3.1",
"typescript": "^5.1.6"
}
}
Paste the package.json of the target module, if it exists
{
"name": "html-tags",
"version": "3.3.1",
"description": "List of standard HTML tags",
"license": "MIT",
"repository": "sindresorhus/html-tags",
"funding": "https://github.com/sponsors/sindresorhus",
"author": {
"name": "Sindre Sorhus",
"email": "sindresorhus@gmail.com",
"url": "https://sindresorhus.com"
},
"engines": {
"node": ">=8"
},
"scripts": {
"test": "xo && ava && tsd"
},
"files": [
"index.js",
"index.d.ts",
"void.js",
"void.d.ts",
"html-tags.json",
"html-tags-void.json"
],
"keywords": [
"html",
"html5",
"tags",
"elements",
"list",
"whatwg",
"w3c",
"void",
"self-closing"
],
"devDependencies": {
"ava": "^1.4.1",
"tsd": "^0.7.2",
"xo": "^0.24.0"
},
"xo": {
"rules": {
"import/extensions": "off"
}
}
}
Any other comments can go here
I wan to use the latest ES feature of asserted imports to directly load a JSON from the package html-tags. The feature requires targeting esnext and I expected it to be enough, given the no compilation actually happens - the syntax is exactly the same in TS and JS
However, to actually make tsc happy, it is necessary to add --resolveJsonModule --allowSyntheticDefaultImports. Without these two, I'm getting these errors
error TS2732: Cannot find module 'html-tags/html-tags.json'. Consider using '--resolveJsonModule' to import module with '.json' extension.
resolveJsonModule seems completely redundant because importing JSON is supported per assert { type: 'json' }
error TS1259: Module '"/Volumes/Home/projects/temp/resolve-json-module/node_modules/html-tags/html-tags"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
[...]
This module is declared with 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
I'm not sure about this. Isn't default-import the only way to import a JSON file?
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 linked resolve-json-module demo and its index.ts reproduction; run tsc with the shown es2020, esnext, and node16 settings, then compare tsc --showConfig and --traceResolution output with and without the flags. Done means the asserted JSON import type-checks without resolveJsonModule or allowSyntheticDefaultImports while preserving the reported runtime-compatible syntax.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- compilers
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100