fix: update the .vue file shim for Vue 3

[sodatea]

fixes #5889

What kind of change does this PR introduce? (check at least one)

• Bugfix
• Feature
• Code style update
• Refactor
• Docs
• Underlying tools
• Other, please describe:

Does this PR introduce a breaking change? (check one)

• Yes
• No

Other information:

The migrator is not likely to be invoked by users until we release CLI v5. I only implemented it as an intellectual exercise for myself.

Though, users can still invoke it by vue migrate typescript --from 4.5.6, which is slightly better than reading the template source code and copy-paste the new shim themselves.

[sodatea]

@pikax @cexbrayat
Just to make sure I get it right.
Is this the recommended way to shim .vue files now in Vue 3 stable?

[cexbrayat]

I think you have something weird with import type, but otherwise yes this is what I've been using:

declare module '*.vue' {
  import { DefineComponent } from 'vue';
  const component: DefineComponent;
  export default component;
}

[sodatea]

What does "something weird with import type" mean?

[cexbrayat]

Sorry if I wasn't clear: I don't think import type is necessary here, as DefineComponent is just a type, so there is no tree-shaking issue. I'm fine if you prefer to keep it, I was just pointing out that the syntax is a bit more advanced, and might lose some developers not familiar with the latest TS features

[sodatea]

OK. Now that it's only a style issue then I'll keep it. Because now Vue CLI scaffolds with TS 3.9+, which supports this syntax. And the import type syntax is quite self-explaining so that people won't mistakenly take DefineComponent as a value, making the code a little clearer.