Type inferrence modified in pinia 2.2.3, was working fine until then

[stephane303]

Reproduction

https://github.com/stephane303/pinia-demo

Steps to reproduce the bug

To reproduce:

pnpm install

Check types:

npx vue-tsc --build --force

You will get

src/App.vue:6:19 - error TS7006: Parameter 'zone' implicitly has an 'any' type.

6 store.zones.find((zone) => zone.r =='b');
                    ~~~~


Found 1 error.

If you change the version of pinia to 2.2.2

You will get no error

Expected behavior

Type inference is not modified

Actual behavior

Type inference not working any more

Additional information

No response

[stephane303]

@posva
This demo shows that the readonly solution, which was functioning correctly up until version 2.2.2, no longer works after the update to version 2.2.3. I believe this is an issue that needs to be addressed.

I have taken the time to prepare a demo that clearly demonstrates the problem introduced with the version change. However, instead of addressing the issue, it was moved to a discussion without any explanation. Could you please clarify the reasoning behind this?

[posva]

The repro is excellent! I appreciate it a lot, thanks! I gave it a look and it seems to work with the latest versions.

BTW, in your demo you are not returning the original state. Maybe this is just for the demo but FYI this will fail for devtools, SSR, and some pinia plugins because they won't be able to read the state. I wrote about ways to handle this in this article and cover it deeply in the Mastering Pinia course itself.

To answer your question about the move to discussions, I have my way of handling issues in Pinia to help me organize my life. That's the reasoning without going too deep. In this case

[stephane303]

Yes, it is functioning, but it no longer passes the type-check test as of version 2.2.3:

npx vue-tsc --build --force

This is the root of the issue.

Regarding your article, I am not entirely sure I understand your point, and I don't believe it's necessary to pay for access to basic functionality instructions. What I require is read-only access to the state for the reasons mentioned here.

[posva]

By working, I mean the type check. The playground also has TypeScript checks but it uses up to date versions of everything.

Regarding your article, I am not entirely sure I understand your point, and I don't believe it's necessary to pay for access to basic functionality instructions.

The article is completely free... The rest of the course is far from being "basic functionality instructions". I'm just trying to point you to content that could help.

[stephane303]

I am using a CI, and I need to do

npx vue-tsc --build --force

This is broken since version 2.2.3

To me having a readonly state is basic functionality.

[vaasmundsen]

I am running into the same issue in Vue 2.7, but it is working as expected in Vue 3.5.

In Vue 2.7

const { zones } = storeToRefs(useSettingsStore());
// ^^ const zones: WritableComputedRef<any>

In Vue 3.5

const { zones } = storeToRefs(useSettingsStore());
// ^^ const zones: ComputedRef<Zone[]>

If I modify the store code to return a WritableComputedRef, it will infer it correct Vue 2.7 as well.

// Change to writeable computed
  const readonlyState = Object.fromEntries(
    Object.keys(state).map((key) => [
      key,
      computed({
        get() {
          return state[key as keyof typeof state];
        },
        set() {},
      }),
    ])
  );


const { zones } = storeToRefs(useSettingsStore());
// ^^ const zones: WritableComputedRef<Zone[]>

I am using the same typescript and vue-tsc versions in both projects.

  "dependencies": {
    "pinia": "^2.2.4",
  },
  "devDependencies": {
    "typescript": "^5.6.3",
    "vite": "^5.4.9",
    "vue-tsc": "^2.1.6"
  }

If I change back to version 2.2.2 as mentioned by @stephane303 , it is inferred correctly for Vue 2.7 as well.

[stephane303]

Why Readonly State Is Essential in Pinia