dwightjack / vue-types

Vue Prop Types definitions
https://dwightjack.github.io/vue-types/
MIT License
572 stars 35 forks source link

Could not find a declaration file for module 'vue-types' #419

Closed JeromeDeLeon closed 1 year ago

JeromeDeLeon commented 1 year ago

Describe the bug I scaffolded the project using pnpm create vue@latest with the following options

✔ Project name: … vue-types
✔ Add TypeScript? … No / Yes
✔ Add JSX Support? … No / Yes
✔ Add Vue Router for Single Page Application development? … No / Yes
✔ Add Pinia for state management? … No / Yes
✔ Add Vitest for Unit Testing? … No / Yes
✔ Add an End-to-End Testing Solution? › No
✔ Add ESLint for code quality? … No / Yes

I then added vue-types right after and started using it and got an error

Could not find a declaration file for module 'vue-types'. '/***/vue-types/node_modules/.pnpm/vue-types@5.1.0_vue@3.3.4/node_modules/vue-types/dist/vue-types.modern.js' implicitly has an 'any' type.
  There are types at '/***/vue-types/node_modules/vue-types/dist/index.d.ts', but this result could not be resolved when respecting package.json "exports". The 'vue-types' library may need to update its package.json or typings. ts(7016)

I tried looking for similar issues around

and I tried running tsc --traceResolution and got

Using 'exports' subpath '.' with target './dist/vue-types.modern.js'.
File name '***/node_modules/vue-types/dist/vue-types.modern.js' has a '.js' extension - stripping it.
File '***/node_modules/vue-types/dist/vue-types.modern.ts' does not exist.
File '***/node_modules/vue-types/dist/vue-types.modern.tsx' does not exist.
File '***/node_modules/vue-types/dist/vue-types.modern.d.ts' does not exist.

but I managed to get it working by doing this where I patched the *.d.ts to have similar location and file name of the .(c)js files

{
  "exports": {
    ".": {
-     "require": "./dist/vue-types.cjs",
-     "import": "./dist/vue-types.modern.js",
+     "require": {
+       "default": "./dist/vue-types.cjs",
+       "types": "./dist/vue-types.cjs.d.ts"
+     },
+     "import": {
+       "default": "./dist/vue-types.modern.js",
+       "types": "./dist/vue-types.modern.d.ts"
+     }
    },
    "./shim": {
-     "require": "./shim/index.cjs.js",
-     "import": "./shim/index.modern.js"
+     "require": {
+      "default": "./shim/index.cjs",
+      "types": "./shim/index.cjs.d.ts"
+     },
+     "import": {
+      "default": "./shim/index.modern.js",
+      "types": "./shim/index.modern.d.ts"
+     }
    }
  },
- "types": "dist/index.d.ts"
}

and then re-run the tsc --traceResolution again

Using 'exports' subpath '.' with target './dist/vue-types.modern.js'.
File name '***/node_modules/vue-types/dist/vue-types.modern.js' has a '.js' extension - stripping it.
File '***/node_modules/vue-types/dist/vue-types.modern.ts' does not exist.
File '***/node_modules/vue-types/dist/vue-types.modern.tsx' does not exist.
File '***/node_modules/vue-types/dist/vue-types.modern.d.ts' exists - use it as a name resolution result.

I haven't tested the require or the shim version but hopefully they work the same way

To Reproduce Steps to reproduce the behavior:

  1. Scaffold a new vue project with TS
  2. Install vue-types
  3. Import it
  4. See the error

Expected behavior I'm expecting to not have this error

Library version

{
  "dependencies": {
    "vue": "^3.3.4",
    "vue-types": "^5.1.0"
  },
  "devDependencies": {
    "@tsconfig/node18": "^2.0.1",
    "@types/node": "^18.16.17",
    "@vitejs/plugin-vue": "^4.2.3",
    "@vue/tsconfig": "^0.4.0",
    "npm-run-all": "^4.1.5",
    "typescript": "~5.0.4",
    "vite": "^4.3.9",
    "vue-tsc": "^1.6.5"
  }
}
dwightjack commented 1 year ago

@JeromeDeLeon the changes in #412 should fix the issue. I have released a temporary version. Could you try it and let me know if it works for you?

pnpm add vue-types@0.0.0-20230720044845
dwightjack commented 1 year ago

@JeromeDeLeon the correct PR is #421, sorry

JeromeDeLeon commented 1 year ago

Thanks @dwightjack. I just installed that build and it is now working.

dwightjack commented 1 year ago

@JeromeDeLeon I found a typo in the shim definition and fixed it in vue-types@0.0.0-20230721024211, but the main entry point seems to work fine. I pushed a demo installation here: https://github.com/dwightjack/demo-vue-types, and I see it working correctly on VSCode (look at the src/components/Test.vue component) and when running both the dev and build scripts.

If you're still experiencing the issue after installing vue-types@0.0.0-20230721024211, could you share a reproduction?

JeromeDeLeon commented 1 year ago

@dwightjack Thanks, it is working for me. We pretty much have the same setup as you have on your demo.

dwightjack commented 1 year ago

Released as vue-types@5.1.1.