withDefaults' first argument must be a defineProps call.

[huxinhai]

Describe the bug

使用definePropsRefs的时候在第一次的时候是没有问题的，但是修改了里面的内容触发了vite的热更新的时候会出现withDefaults' first argument must be a defineProps call.

但是我重新是刷新这个界面的时候又好了，但是重新修改内容还是会出现这个问题 我尝试了四台电脑都是这样的问题

Reproduction

https://github.com/huxinhai/vue-macros-main

System Info

System:
    OS: Windows 10 10.0.19044
    CPU: (8) x64 Intel(R) Core(TM) i7-2720QM CPU @ 2.20GHz
    Memory: 16.08 GB / 31.96 GB
  Binaries:
    Node: 20.8.0 - ~\AppData\Local\pnpm\node.EXE
    pnpm: 8.15.3 - ~\AppData\Local\pnpm\npm.CMD
    vue: 3.4.21
    unplugin-vue-macros: 2.7.10
    vite: 5.1.5
    @vitejs/plugin-vue 5.0.4
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (110.0.1587.57)
    Internet Explorer: 11.0.19041.1566

Used Package Manager

pnpm

Validations

• Follow our Code of Conduct
• Read the Contributing Guide.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
• The provided reproduction is a minimal reproducible of the bug.

[dosubot]

嗨，@huxinhai！又见面了，希望一切都好。

The error "withDefaults' first argument must be a defineProps call" occurs because the withDefaults macro expects its first argument to be a direct call to defineProps or definePropsRefs. However, in the context of Vite's hot module replacement (HMR), when you modify the content inside definePropsRefs and save, triggering a hot update, Vite might not correctly re-evaluate the macro transformation, leading to this error. This is because the macro transformation done by Vite (or by a plugin that handles macros) is based on static analysis at build time, and dynamic changes during HMR can sometimes lead to inconsistencies or errors like this one.

To resolve this issue, you can try the following approaches:

1. Force a Full Reload: Sometimes, simply forcing a full page reload (instead of relying on HMR) can resolve the issue, as it causes the entire application to be recompiled and re-evaluated from scratch.

2. Check for Updates: Ensure that your Vite, Vue, and any relevant plugin versions are up to date. Sometimes, bugs related to HMR and macro transformations are fixed in newer versions.

3. Review Macro Usage: Double-check the usage of withDefaults and definePropsRefs to ensure they are being used correctly according to the latest documentation. Misuse or unconventional patterns might lead to unexpected behavior, especially with HMR.

4. Report the Issue: If the problem persists and you believe it's a bug with Vite, the Vue plugin for Vite, or the library providing the withDefaults macro, consider reporting the issue on their respective GitHub issue trackers. Provide detailed information about your setup, the error, and steps to reproduce.

5. Temporary Workaround: As a temporary workaround, you might consider avoiding the use of withDefaults with definePropsRefs during development, or structuring your code in a way that minimizes the need for hot updates to the parts of the code using these features.

Remember, HMR issues can be tricky to diagnose and resolve due to their dynamic nature and dependency on the development environment's specific configuration and versions of tools and libraries.

The withDefaults macro in the vue-macros library is used to provide default values for Vue component props defined with definePropsRefs. In the provided context, it is used to specify that the prop foo has a default value of 'foo'. This macro enhances the type inference for props by ensuring that the types reflect the provided defaults, making the props reactive and accessible as ComputedRef within the Vue component setup.

From the given code snippet, it's evident that withDefaults is used to assign default values to props in a way that integrates smoothly with TypeScript, allowing for type-safe operations on these props. The expectTypeOf assertions confirm that foo is treated as a ComputedRef<string> and bar as a ComputedRef<readonly number[] | undefined>, indicating that withDefaults also preserves the optionality and type of props that do not have defaults specified.

For more details, you can refer to the withDefaults usage in the vue-macros test fixtures.

I also found a similar closed issue withDefaults can only be used with type-based defineProps declaration which might be related to your problem. This issue was closed by a commit: fix(reactivity-transform): support runtime-based defineProps on May 16, 2023. You might want to check if this commit is included in your current version of vue-macros.

Sources

• withDefaults can only be used with type-based defineProps declaration
• packages/define-props-refs/tests/fixtures/with-defaults.vue

About Dosu

This response is meant to be useful and save you time. It is not meant to be a precise solution, but rather a starting point for your own research.

Help me be more useful! Please leave a 👍 if this is helpful and 👎 if it is irrelevant.

If you want to continue the conversation, start your reply with @dosu-bot.

[huxinhai]

我这边如果不使用with 而使用assert的情况下会提示assert已废弃 让我使用with

[sxzz]

Confirmed it's a bug.

[huxinhai]

Then if you have repaired it, could you please reply to me so that I can update it