vuejs / vuex

🗃️ Centralized State Management for Vue.js.
https://vuex.vuejs.org
MIT License
28.41k stars 9.57k forks source link

Fix type definitions with `moduleResolutions` `nodenext` #2213

Open ZachHaber opened 1 year ago

ZachHaber commented 1 year ago

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch vuex@3.6.2 for the project I'm working on.

Typescript with nodenext resolution ignores the "typings" property completely when "exports" is specified, which causes typescript to complain that it can't find any type definitions for this package.

https://github.com/microsoft/TypeScript/issues/49160#issuecomment-1137482639

This should work fine on both v3 and v4, since both have the same issue with typescript and the exports object.

Here is the diff that solved my problem:

diff --git a/node_modules/vuex/package.json b/node_modules/vuex/package.json
index e8a851e..4cd1fce 100644
--- a/node_modules/vuex/package.json
+++ b/node_modules/vuex/package.json
@@ -7,7 +7,8 @@
     ".": {
       "module": "./dist/vuex.esm.js",
       "require": "./dist/vuex.common.js",
-      "import": "./dist/vuex.mjs"
+      "import": "./dist/vuex.mjs",
+      "types": "./types/index.d.ts"
     },
     "./": "./"
   },

This issue body was partially generated by patch-package.

trim21 commented 1 year ago

last fix commit is 2 years , I'm wondering is this package still maintained...

masaha03 commented 1 year ago

My workaround for the vuex type definition error:

declare module "vuex" {
  export * from "vuex/types/index.d.ts";
  export * from "vuex/types/helpers.d.ts";
  export * from "vuex/types/logger.d.ts";
  export * from "vuex/types/vue.d.ts";
}

Save the above code under an appropriate directory with a name like vuex.d.ts. This should allow TypeScript to correctly recognize the vuex module.

stouch commented 9 months ago

Changing the vuex package.json with :

{
  "name": "vuex",
  "version": "4.0.2",
...
  "exports": {
    ".": {
      "module": "./dist/vuex.esm-bundler.js",
      "require": "./dist/vuex.cjs.js",
      "import": {
         "default": "./dist/vuex.mjs", 
         "types": [
            "./types/index.d.ts",
            "./types/helpers.d.ts",
            "./types/logger.d.ts",
            "./types/vue.d.ts"
          ]
      }
    },
  },
...

fixes the issue