motion icon indicating copy to clipboard operation
motion copied to clipboard

TypeScript prompts an error when importing @vueuse/motion

Open lxxorz opened this issue 1 year ago • 12 comments

TypeScript prompts an error when importing @vueuse/motion

image

Steps to Reproduce:

Run

  1. pnpm create vite to create a new Vite project. Choose Vue + TypeScript as the project template.
  2. pnpm add @vueuse/core @vueuse/motion

Expected Behavior:

The packages @vueuse/core and @vueuse/motion should be installed and imported without any TypeScript errors.

Actual Behavior:

When importing @vueuse/motion, TypeScript provides the following error message:

Could not find a declaration file for module '@vueuse/motion'. '/home/user/test/node_modules/.pnpm/@[email protected][email protected]/node_modules/@vueuse/motion/dist/index.mjs' implicitly has an 'any' type. There are types at '/home/user/test/node_modules/@vueuse/motion/dist/index.d.ts', but this result could not be resolved when respecting package.json "exports". The '@vueuse/motion' library may need to update its package.json or typings.ts(7016)

Additional Information: package.json

{
  "dependencies": {
    "@vueuse/core": "^10.1.2",
    "@vueuse/motion": "2.0.0-beta.27",
    "vue": "^3.2.47"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^4.1.0",
    "typescript": "^5.0.2",
    "vite": "^4.3.2",
    "vue-tsc": "^1.4.2"
  }
}

lxxorz avatar May 09 '23 13:05 lxxorz

I get the same result when trying to incorporate this package into my typescript vue build

ktranish avatar May 20 '23 16:05 ktranish

same error

init-center avatar May 22 '23 03:05 init-center

same error...

Gabrodriguez8i avatar May 30 '23 06:05 Gabrodriguez8i

This only seems to happen on ts 5 builds Edit: TS4.9 seems to also be affected by this due to the new way it resolves typing imports

MaxTechnics avatar Jun 13 '23 19:06 MaxTechnics

To solve this problem, modify the tsconfig.json file

tsconfig.json

MIN202299 avatar Jun 30 '23 04:06 MIN202299

I tried the above fix but I am still getting the aforementioned error.

src/main.ts:1:30 - error TS7016: Could not find a declaration file for module '@vueuse/motion'. '/*/node_modules/@vueuse/motion/dist/index.mjs' implicitly has an 'any' type.
  There are types at '/*/node_modules/@vueuse/motion/dist/index.d.ts', but this result could not be resolved when respecting package.json "exports". The '@vueuse/motion' library may need to update its package.json or typings.

1 import { MotionPlugin } from '@vueuse/motion'
                               ~~~~~~~~~~~~~~~~


Found 1 error in src/main.ts:1

ERROR: "type-check" exited with 2.

ramonakira avatar Aug 15 '23 14:08 ramonakira

Same here.

marsidev avatar Oct 24 '23 20:10 marsidev

I solved this issue by changing the tsconfig.json with this

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "lib": ["dom", "esnext"],
    "strict": true,
    "noImplicitAny": false,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "incremental": true,
    "moduleResolution": "node",
    "forceConsistentCasingInFileNames": true
  },
  "exclude": ["node_modules", "dist"]
}


afrijaldz avatar Nov 03 '23 05:11 afrijaldz

setting moduleResolution to node woked for me "moduleResolution": "node"

byStrange avatar Jan 10 '24 08:01 byStrange

that configuration doesnt work on my project, i dont know why, i still get that error

MoRanYue avatar Feb 20 '24 01:02 MoRanYue

I'm unable to reproduce this issue by following your reproduction steps using the latest release v2.1.0, so I think this issue has been resolved and can be closed.

BobbieGoede avatar Feb 22 '24 08:02 BobbieGoede

Can confirm that this release fixed the issue

MaxTechnics avatar Feb 22 '24 17:02 MaxTechnics