auto-animate icon indicating copy to clipboard operation
auto-animate copied to clipboard

Relative import paths need explicit file extensions in EcmaScript imports

Open Sheraff opened this issue 3 years ago • 0 comments

I tried adding auto-animate to a react package that is built and exported for use in another repo. The build step for the package looks like this tsc && babel ./src --extensions '.js,.jsx,.ts,.tsx'.

However, during the build, I get a typescript error

error TS2835: Relative import paths need explicit file extensions in EcmaScript imports when '--moduleResolution'
is 'node16' or 'nodenext'. Did you mean '../index.mjs'?

2 import { AutoAnimateOptions, AutoAnimationPlugin } from "../index";
                                                          ~~~~~~~~~~

Found 1 error in node_modules/@formkit/auto-animate/react/index.d.ts:2

For reference, the tsconfig.json file looks like this (abbreviated for clarity):

{
  "compilerOptions": {
    "lib": ["ESNext", "DOM"],
    "target": "ESNext",
    "module": "commonjs",
    "jsx": "react-jsx",
    "esModuleInterop": true,
    "moduleResolution": "NodeNext"
    "baseUrl": ".",
    "resolveJsonModule": true
  },
  "include": ["src"],
  "exclude": ["node_modules"]
}

This is using:

"@formkit/auto-animate": "^1.0.0-beta.5",
"react": "18.0.0",
"typescript": "4.7.4"

But the issue was also reproduced with "typescript": "4.9.3" and also trying to use other versions of auto-animate 1.0.0-beta.1 and 1.0.0-beta.3

Is there any way for me to use auto-animate right now? I'd be open to changing my tsconfig or adding some plugin to make this work.

Sheraff avatar Dec 02 '22 18:12 Sheraff