Skip to content

importModuleSpecifierEnding = js doesn't apply for autocomplete within import paths #44374

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.

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

Closed
Tyriar opened this issue Jun 1, 2021 · 5 comments · Fixed by #44602
Closed

importModuleSpecifierEnding = js doesn't apply for autocomplete within import paths #44374

Tyriar opened this issue Jun 1, 2021 · 5 comments · Fixed by #44602
Assignees
Labels
Bug A bug in TypeScript Domain: Completion Lists The issue relates to showing completion lists in an editor Fix Available A PR has been opened for this issue

Comments

@Tyriar
Copy link
Member

Tyriar commented Jun 1, 2021

Bug Report

I have this workspace setting which works great for auto import:

"typescript.preferences.importModuleSpecifierEnding": "js"

But when auto completing the path it still does .ts which requires manually changing:

image

🔎 Search Terms

importModuleSpecifierEnding

🕗 Version & Regression Information

4.3.0-dev.20210503

@DanielRosenwasser DanielRosenwasser added the Bug A bug in TypeScript label Jun 2, 2021
@DanielRosenwasser DanielRosenwasser added the Domain: Completion Lists The issue relates to showing completion lists in an editor label Jun 2, 2021
@jessetrinity
Copy link
Contributor

jessetrinity commented Jun 11, 2021

Do you have

{
    "compilerOptions": {
        "allowJs": true
    }
}

?
edit: see https://www.typescriptlang.org/tsconfig#allowJs. We probably need something to indicate that you need to set allowJs to actually get the .js imports.

@Tyriar
Copy link
Member Author

Tyriar commented Jun 12, 2021

No I don't set that, I can't actually remember why I ended up needing to use .js imports but at some point this not having it was causing exceptions due to some bundling problem. I just tried to remove and it seemed to work, I'm a little hesitant to change it when it working though.

But why would you need allowJS for this to work when I've said I want to use .js imports already with importModuleSpecifierEnding?

@jessetrinity
Copy link
Contributor

jessetrinity commented Jun 14, 2021

Importing a .js file should not be allowed at all if allowJs is not enabled, so files with a .js extension will not show up in the completion list.

That is, if you have allowJs: false (this is the default) and the file

// file: myLib.js
export const myConst = 1;

and type the following in a .ts file,

myConst

You should not be offered a completion at all. If you enable allowJs, this should auto complete to the .js file assuming you have "typescript.preferences.importModuleSpecifierEnding": "js".

What I think is a bug, is that we complete with the .ts ending when there is also a .ts file with the same name present. It looks like the importModuleSpecifierEnding setting is just used to decide whether or not we remove the extension on string literal completion in the import. If allowJs is false, the .js import is not found, but we still offer the completion for the .ts file with the same name, but with the extension (incorrectly) attached. I think in this case we should offer the completion without any extension.

cc @andrewbranch as I'm not super familiar with how module resolution works.

Edit: after more investigation I see that auto import completion (not import string completion) adds the .js extension even if allowJs is false, if there is a .ts file present with the same name. I'm no longer sure if it is intended behavior or not to offer import completions with .js with allowJs: false...

@Tyriar
Copy link
Member Author

Tyriar commented Jun 15, 2021

I can't remember the exact reason but using .js fixed a compile/bundling issue for me at some point. I use tsc and then webpack on its output, could be related to workers, dynamic imports or es modules.

@andrewbranch
Copy link
Member

andrewbranch commented Jun 15, 2021

Auto imports are working correctly and these path completions are working incorrectly. You’re never allowed to write .ts in a module specifier. You are always allowed to write a module specifier for a TS file as a .js path, and you are allowed to write an import for an actual JS source file only if allowJs is enabled. The example shown here is for a TS source file, so the completion should be shown as number.js regardless of the allowJs setting.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug A bug in TypeScript Domain: Completion Lists The issue relates to showing completion lists in an editor Fix Available A PR has been opened for this issue
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants