Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Typescript file imports being appended with .js extensions intermittently #52167

Closed
AaronMcCloskey opened this issue Dec 29, 2022 · 10 comments · Fixed by #53691
Closed

Typescript file imports being appended with .js extensions intermittently #52167

AaronMcCloskey opened this issue Dec 29, 2022 · 10 comments · Fixed by #53691
Assignees
@andrewbranch
Labels
Fix Available A PR has been opened for this issue Needs Investigation This issue needs a team member to investigate its status.
Milestone
TypeScript 5.1.0

Comments

@AaronMcCloskey
Copy link

Does this issue occur when all extensions are disabled?: Yes

  • VS Code Version: 1.74.2
  • OS Version: macOS Monterey 12.6

Steps to Reproduce:

  1. Commented out all of my settings.json file, so uses the default settings
  2. Restart VSCode with Extensions Disabled
  3. In certain .ts files in my project, when I go to import another .ts file the autocomplete option for the import adds a .js file extension.
  4. The same import made in another .ts file in the same directory or another directory, does not append the .js file extension.
  5. Sometimes in the .ts file(s) that appends the .js file extension on the auto import, when I remove all of the code and then try to import, it does not append the .js extension. But if I close the file and re-open it again, it will. But this is intermittent.
  6. See Videos below for issue
  • Sorry, had to split in 2 due to file sizes
Screen.Recording.2022-12-29.at.21.16.32.mov
Screen.Recording.2022-12-29.at.21.18.10.mov

Not sure how much the tsconfig.json file can affect this but this is my ts config.

{
  "compilerOptions": {
    "target": "es2017",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "noUncheckedIndexedAccess": true,
    "noUnusedLocals": true /* Report errors on unused locals. */,
    "noUnusedParameters": true /* Report errors on unused parameters. */,
    "allowSyntheticDefaultImports": true /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "strictFunctionTypes": true,
    "noImplicitThis": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true
  },
  "include": ["next-env.d.ts", "types/**/*.ts", "next-auth.d.ts", "**/*.ts", "**/*.tsx", "**/*.js", "**/*.cjs", "**/*.mjs"],
  "exclude": ["node_modules"]
}
@AaronMcCloskey
Copy link
Author

FWIW, seems that adding

"typescript.preferences.importModuleSpecifierEnding": "minimal"

into my settings.json seems to resolve the issue, but still not sure why it doesn"t seem to happen in other projects I have or even other files in this project.

@mjbvz mjbvz transferred this issue from microsoft/vscode Jan 9, 2023
@mjbvz mjbvz removed their assignment Jan 9, 2023
@RyanCavanaugh RyanCavanaugh added the Needs Investigation This issue needs a team member to investigate its status. label Jan 12, 2023
@RyanCavanaugh RyanCavanaugh added this to the TypeScript 5.1.0 milestone Jan 12, 2023
@andrewbranch
Copy link
Member

Can you share the project where this is happening?

@jespertheend jespertheend mentioned this issue Mar 26, 2023
Closed
@jespertheend
Copy link
Contributor

I"m running into an issue that I think has the same root cause. I want .js endings but I"m not getting them, since I"m working exclusively with .js files already.

@andrewbranch You can find my project at https://github.com/rendajs/Renda, it doesn"t require a whole lot of work to get it up and running, but you do need to have Deno installed in order for it to automatically download TypeScript 5.0.2. Otherwise I think you might also be able to reproduce this by manually placing the TypeScript package in ./Renda/npm_packages/typescript/5.0.2/.

@jespertheend
Copy link
Contributor

Screen recording with steps to reproduce:

screen.recording.mp4

@jespertheend
Copy link
Contributor

Seems like adding "moduleResolution": "bundler" and "allowImportingTsExtensions": true to the jsconfig fixes this issue for me. At least it does for now.

@andrewbranch andrewbranch mentioned this issue Apr 6, 2023
Merged
@typescript-bot typescript-bot added the Fix Available A PR has been opened for this issue label Apr 6, 2023
@IgorKrupenja IgorKrupenja mentioned this issue Jul 26, 2023
Closed
@Astarosa
Copy link

Astarosa commented Sep 20, 2023 •
edited
Loading

The Typescript documentation recommand to now use module and moduleResolution to NodeNext. But if you do so it generate the error with .js file extension required.
The solution for me was to set this to "module": "es2022" and "moduleResolution": "Bundler"

I use Typescript 5.2.2

@bkilrain
Copy link

I noticed this has started happening in the latest version vscode (1.88) despite the settings mentioned in this thread. Downgrading fixed the issue for me. Leaving a note here for others to find...

@hatealgebra
Copy link

Seems like adding "moduleResolution": "bundler" and "allowImportingTsExtensions": true to the jsconfig fixes this issue for me. At least it does for now.

Hi, the "allowImportingTsExtensions": true did the trick for me. Thanks a lot!

@bkilrain
Copy link

bkilrain commented Aug 5, 2024

Coming back here because after upgrading to vscode 1.92, this behavior returned and I didn"t want to stay stuck on 1.88 forever. I eventually figured out the .js extensions were being added because of an imports field in my package.json. When I removed that, auto import worked as expected. Example snippet:

"imports": {
    "#*": "./*"
  },

@theoludwig theoludwig mentioned this issue Aug 7, 2024
Closed
@theoludwig
Copy link

Coming back here because after upgrading to vscode 1.92, this behavior returned and I didn"t want to stay stuck on 1.88 forever. I eventually figured out the .js extensions were being added because of an imports field in my package.json. When I removed that, auto import worked as expected. Example snippet:

"imports": {
    "#*": "./*"
  },

Indeed, without "imports" in package.json, it auto impot correctly with .ts as expected. But this looks like a bug to me, it should also work with the "imports" field in package.json.
I"ve created an issue for this bug: #59553

@ethanjdiamond ethanjdiamond mentioned this issue Nov 5, 2024
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@andrewbranch andrewbranch

Labels
Fix Available A PR has been opened for this issue Needs Investigation This issue needs a team member to investigate its status.
Projects
None yet
Milestone
TypeScript 5.1.0
Development

Successfully merging a pull request may close this issue.

Fix two module specifier ending preference detection issues andrewbranch/TypeScript
10 participants
@jespertheend @andrewbranch @RyanCavanaugh @mjbvz @bkilrain @AaronMcCloskey @typescript-bot @theoludwig @Astarosa @hatealgebra