Skip to content

ESM import/export is broken with Typescript >= 4.7 and moduleResolution=node16 #52

@GabrielDelepine

Description

@GabrielDelepine

Minimal reproduction repo

https://github.com/GabrielDelepine/tsc-esm-issue-with-use-ssr

Bug report

I am migrating a repository to standard ESM, and I got the following issue with use-ssr.

 error TS2349: This expression is not callable.
  Type 'typeof import("_THE_PATH_OF_MY_PROJECT_HERE/node_modules/use-ssr/dist/useSSR")' has no call signatures.

21   const { isServer } = useSSR();

A full description of the issue, as well as a solution to fix it, is available here

From what I understood: use-ssr describes the default export from the main field of package.json, which is making Typescript interpret it as a CommonJS default export. Full explanation here

For those who are looking for an immediate solution, please find a workaround here

Environment

Node 18
Typescript 4.8.4 with the following config

{
  "compilerOptions": {
    "target": "es2017",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "baseUrl": ".",
    "paths": {
      "*": ["./app/*"],
    },
    "skipLibCheck": true,
    "strict": true,
    "strictNullChecks": true,
    "alwaysStrict": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": false,
    "esModuleInterop": true,
    "module": "NodeNext",
    "moduleResolution": "node16",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "react"
  },
  "exclude": [
    "node_modules",
    "build"
  ],
  "include": [
    "**/*.ts",
    "**/*.tsx",
    "**/*.json"
  ]
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions