microsoft / microsoft/TypeScript

Wrong import suggestion in subpath pattern

Open
#52,870 6 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Needs Investigation
Dominant language
Go
Stars
111k
Forks
14.3k
Avg merge
1d 19h
Merged PRs (30d)
117

Description

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

  • VS Code Version: 1.75.1
  • OS Version: Darwin x64 22.1.0 (MacOS)

Steps to Reproduce:

  1. Install @neo4j-ndl/react@1.0.0-alpha-fafbc08
  2. Try to import an icon like <AdjustmentsHorizontalIconSolid /> in a JSX file.

The recommended import path is @neo4j-ndl/react/lib/types/icons while the correct based on the exports field would be @neo4j-ndl/react/icons

The modified package.json is looking like this:

{
  "name": "@neo4j-ndl/react",
  "version": "0.17.7",
  "sideEffects": false,
  "description": "React implementation of Neo4j Design System",
  "keywords": [
    "neo4j",
    "react",
    "design system",
    "needle",
    "ndl"
  ],
  "author": "Neo4j Inc.",
  "homepage": "",
  "license": "GPL-3.0",
  "main": "./lib/cjs/index.js",
  "module": "./lib/esm/index.js",
  "types": "./lib/types/index.d.ts",
  "exports": {
    "./icons": {
      "import": "./lib/esm/icons/index.js",
      "require": "./lib/cjs/icons/index.js",
      "types": "./lib/types/icons/index.d.ts"
    },
    ".": {
      "import": "./lib/esm/index.js",
      "require": "./lib/cjs/index.js",
      "types": "./lib/types/index.d.ts"
    }
  },
 ...
}

As a library publishers tried it also with WebStorm to see how it behaves and I can see that there it is imported as expected (video):

https://user-images.githubusercontent.com/12672541/219434237-a77ee748-c7b3-4995-a083-0690af3d9657.mp4

Also noticed, that if there is one module imported from @neo4j-ndl/react/icons then the suggestion works as expected (image):
CleanShot 2023-02-16 at 18 00 20@2x

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue in a JSX file using the modified package.json and its exports field, starting with the @neo4j-ndl/react/icons package example. Trace the import-suggestion behavior for a package subpath pattern and compare it with the working case after an import from @neo4j-ndl/react/icons. Done means the suggested path is @neo4j-ndl/react/icons rather than @neo4j-ndl/react/lib/types/icons.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, typescript
Domain
developer-experience, tooling
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.