Does not alllow `null` for optional props

rchl commented 1 week ago

Vue - Official extension or vue-tsc version

2.1.6

VSCode version

1.93.1

Vue version

3.5.8

TypeScript version

5.6.2

System Info

System:
    OS: macOS 14.6.1
    CPU: (10) arm64 Apple M1 Max
    Memory: 6.20 GB / 64.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.16.0 - ~/.nvm/versions/node/v20.16.0/bin/node
    Yarn: 1.22.22 - ~/.yarn/bin/yarn
    npm: 10.8.1 - ~/.nvm/versions/node/v20.16.0/bin/npm
    pnpm: 9.9.0 - ~/.nvm/versions/node/v20.16.0/bin/pnpm
  Browsers:
    Chrome: 129.0.6668.59
    Safari: 18.0
    Safari Technology Preview: 18.0

package.json dependencies

"dependencies": {
    "vue": "^3.5.6"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^5.1.3",
    "typescript": "^5.5.3",
    "vite": "^5.4.6",
    "vue-tsc": "^2.1.6"
  }

Steps to reproduce

Create component with optional String props:

  props: {
    msg: {
      type: String,
      default: null,
    },
  },

Pass null to msg prop from the parent component:

<HelloWorld :msg="null" />

What is expected?

No type error

What is actually happening?

src/App.vue:9:16 - error TS2322: Type 'null' is not assignable to type 'string | undefined'.

9   <HelloWorld :msg="null" />

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-3fqeyw?file=tsconfig.json,src%2FApp.vue,src%2Fcomponents%2FHelloWorld.vue,package.json&terminal=dev

Any additional comments?

I'm not sure why is null not allowed. Vue doesn't complain when being passed either undefined or null (see attached reproduction).

Note: regardless whether null or undefined is passed, Vue sets the value to null within the component.

KazariEX commented 1 week ago

It should be a https://github.com/vuejs/core issue.