GithubHelp home page GithubHelp logo

Comments (5)

privatenumber avatar privatenumber commented on May 11, 2024 3

Confirmed this is TypeScript behavior:

index.ts

import test from 'test-package';
console.log(test);

node_modules/test-package/package.json

{ "exports": "./file.js" }

node_modules/test-package/file.ts

export default 1234;

Output

$ npx tsc --noEmit --traceResolution

...

======== Resolving module 'test-package' from '/test-js-ext-ts/index.ts'. ========
Explicitly specified module resolution kind: 'Node16'.
File '/test-js-ext-ts/package.json' exists according to earlier cached lookups.
Loading module 'test-package' from 'node_modules' folder, target file type 'TypeScript'.
Found 'package.json' at '/test-js-ext-ts/node_modules/test-package/package.json'.
'package.json' does not have a 'typesVersions' field.
File name '/test-js-ext-ts/node_modules/test-package/file.js' has a '.js' extension - stripping it.
File '/test-js-ext-ts/node_modules/test-package/file.ts' exist - use it as a name resolution result.
Resolving real path for '/test-js-ext-ts/node_modules/test-package/file.ts', result '/test-js-ext-ts/node_modules/test-package/file.ts'.
======== Module name 'test-package' was successfully resolved to '/test-js-ext-ts/node_modules/test-package/file.ts'. ========

...

from tsx.

privatenumber avatar privatenumber commented on May 11, 2024

Does TypeScript follow this resolution logic?

from tsx.

remcohaszing avatar remcohaszing commented on May 11, 2024

Does TypeScript follow this resolution logic?

Yes. (I think as of version 4.7)

from tsx.

monsanto avatar monsanto commented on May 11, 2024

To save anyone else blocked by this issue some time: I tried out a number of TypeScript loaders and unfortunately ts-node is the only one I know of that handles this aspect of TypeScript's module resolution algorithm correctly.

from tsx.

Snurppa avatar Snurppa commented on May 11, 2024

Stumbled here when suspecting that tsx watch did not recompile when a file imported via "Subpath imports" was edited.

Edit: After few changes in my local environment, tsx seems to work just fine even when using subpath imports.
Something was off, one of them being that I had old builds in dist/, which were picked up in "dev mode" with tsx.

Sorry for the original inaccurate comment. I will leave my original comment (with fixed package.json) comment below.

Summary is that with TS 5.4-beta the combination of tsx watch + "imports": {"#app/*":...} + import logger from '#app/utils/logger.js' + no "paths": in tsconfig.json is working fine in watch mode.

FYI I am using tsx watch --conditions=development to pick "correct" subpath import in development mode (./src/*) vs in "production" mode when running with plain Node (./dist/*).

Original comment about `tsx watch` with subpath imports in TS 5.4-beta

Stumbled here when noticing that tsx watch did not recompile when file imported via "Subpath imports" was edited.

This is sort of FYI, but thought to inform that I was excited to use a TS feature, currently in TS 5.4-beta (microsoft/TypeScript#55015), with which I was able to accomplish "single source of truth" by just defining package.json "imports", without using duplicate TS Config "paths" declaration.

My "imports"/"exports" in package.json:

{
  "name": "my-backend",
  "version": "1.0.0",
  "type": "module",
  "engines": {
    "node": ">= 18.17.0"
  },
  "exports": {
    ".": "./dist/index.js",
    "./sensor.json": "./sensor.json"
  },
  "imports": {
    "#app/*": {
      "development": "./src/*",
      "default": "./dist/*"
    }
  }
tsconfig.json from `tsc --showConfig`, long list of `"files": [..]` omitted
{
    "compilerOptions": {
        "lib": [
            "es2023"
        ],
        "module": "node16",
        "target": "es2022",
        "strict": true,
        "esModuleInterop": true,
        "skipLibCheck": true,
        "forceConsistentCasingInFileNames": true,
        "moduleResolution": "nodenext",
        "composite": true,
        "incremental": true,
        "declaration": true,
        "declarationMap": true,
        "outDir": "./dist",
        "rootDir": "./src",
        "moduleDetection": "force",
        "allowSyntheticDefaultImports": true,
        "resolvePackageJsonExports": true,
        "resolvePackageJsonImports": true,
        "useDefineForClassFields": true,
        "noImplicitAny": true,
        "noImplicitThis": true,
        "strictNullChecks": true,
        "strictFunctionTypes": true,
        "strictBindCallApply": true,
        "strictPropertyInitialization": true,
        "alwaysStrict": true,
        "useUnknownInCatchVariables": true
    },
    "include": [
        "src/**/*.ts"
    ],
    "exclude": [
        "node_modules"
    ]
}

I have files:

  • src/api/proxy/wms.ts
  • src/utils/logger.ts

With wms.ts having import logger from '#app/utils/logger.js', tsx watch doesn't notice changes in logger.js.

TypeScript 5.4-beta successfully resolves the module, here is an excerpt from tsc --traceResolution regarding successful resolution of subpath import:

======== Resolving module '#app/utils/logger.js' from 'src/api/proxy/wms.ts'. ========
Explicitly specified module resolution kind: 'NodeNext'.
Resolving in ESM mode with conditions 'import', 'types', 'node'.
'paths' option is specified, looking for a pattern to match module name '#app/utils/logger.js'.
File 'src/api/proxy/package.json' does not exist according to earlier cached lookups.
File 'src/api/package.json' does not exist according to earlier cached lookups.
File 'src/package.json' does not exist according to earlier cached lookups.
File 'package.json' exists according to earlier cached lookups.
Using 'imports' subpath '#app/*' with target './dist/utils/logger.js'.
File 'src/utils/logger.ts' exists - use it as a name resolution result.
Resolving real path for 'src/utils/logger.ts', result 'src/utils/logger.ts'.
======== Module name '#app/utils/logger.js' was successfully resolved to 'src/utils/logger.ts' with Package ID 'my-backend/src/utils/[email protected]'. ========

I think the 'paths' option is specified... logging is confusing here, as the PR was recently merged and only released in beta, so I assume it is just a relic string in TS. Because I don't have any "paths": ... declared in tsconfig.json.

Dunno if this was of any help in the future, but anyway I want to thank you for the great tool and efforts here!

from tsx.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.