vueuse / motion

🤹 Vue Composables putting your components in motion

Home Page:https://motion.vueuse.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

TypeScript prompts an error when importing @vueuse/motion

lxxorz opened this issue · comments

commented

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/@vueuse+motion@2.0.0-beta.27_vue@3.2.47/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"
  }
}

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

same error

same error...

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

commented

To solve this problem, modify the tsconfig.json file

tsconfig.json

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.

Same here.

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"]
}


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

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

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.

Can confirm that this release fixed the issue