Skip to content

Bug: react-jsxdev support for add all missing imports #41920

Closed
@xiaoxiangmoe

Description

@xiaoxiangmoe
  • VSCode Version: 1.51.1
  • OS Version: Darwin x64 20.1.0

Steps to Reproduce:

1.mkdir vscode-react-import && cd vscode-react-import
2.yarn add react @types/react typescript
3. modify files as bellow

tsconfig.json

{
  "compilerOptions": {
    "module": "es2020",
    "moduleResolution": "node",
    "jsx": "react-jsxdev"
  }
}

.vscode/settings.json

{
  "typescript.tsdk": "node_modules/typescript/lib"
}

foo.tsx

export default function Foo(){
  return <></>
}

bar.tsx

export default function Bar(){
  return <Foo></Foo>
}

4.Select TypeScript version, Use workspace version 4.1.2
5. Move cursor to Foo, see error Cannot find name 'Foo'.ts(2304)
image
6. type + .
image
7. Add all missing imports, then result:

import * as React from "react";

export default function Bar(){
  return <Foo></Foo>
}
  1. Move cursor to Foo, type + .
    image
  2. Add all missing imports, then result
import * as React from "react";
import Foo from "./foo";

export default function Bar(){
  return <Foo></Foo>
}

We should not add import * as React from "react"; when tsconfig has "jsx": "react-jsxdev" or "jsx": "react-jsx"


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

Metadata

Metadata

Assignees

No one assigned

    Labels

    BugA bug in TypeScriptDomain: JSX/TSXRelates to the JSX parser and emitterDomain: Quick FixesEditor-provided fixes, often called code actions.Effort: ModerateRequires experience with the TypeScript codebase, but feasible. Harder than "Effort: Casual".Help WantedYou can do this

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions