Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[compiler-sfc] the inlineTemplate option makes it hard to expose component name to dev tools #5496

Open
haoqunjiang opened this issue Mar 1, 2022 · 0 comments
Labels
🍰 p2-nice-to-have Priority 2: this is not breaking anything but nice to have it addressed. scope: compiler scope: script-setup scope: sfc

Comments

@haoqunjiang
Copy link
Member

What problem does this feature solve?

As previously discussed in private, the inlineTemplate option should always be turned on for production for best performance.

/**
* Compile the template and inline the resulting render function
* directly inside setup().
* - Only affects `<script setup>`
* - This should only be used in production because it prevents the template
* from being hot-reloaded separately from component state.
*/
inlineTemplate?: boolean

But it surfaces another problem: enabling this option makes it hard to expose necessary information to the devtools in production.

As described in vitejs/vite#4984 (comment), devtools relies on the __file field to infer the component's name.
But with inlineTemplates enabled, <script setup> components are closed by default, therefore the devtools cannot get the field from the component instances.

It is hard for build tools to expose this field automatically, because of the dynamic nature of the expose call.
Users may or may not have called defineExpose by themselves, or have defined the expose field in a sibling <script> block.
Even if it can be implemented on the @vite/plugin-vue or vue-loader side, it would be a burden to keep maintaining.

What does the proposed API look like?

So I think the best solution is to auto-expose __file in the @vue/compiler-sfc package.

The __file field is like __vccOpts, served as an undocumented convention for various core libraries to work better together.

@haoqunjiang haoqunjiang added scope: compiler scope: sfc 🍰 p2-nice-to-have Priority 2: this is not breaking anything but nice to have it addressed. labels Mar 16, 2023
@haoqunjiang haoqunjiang added 🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. scope: script-setup and removed 🍰 p2-nice-to-have Priority 2: this is not breaking anything but nice to have it addressed. labels Aug 15, 2023
@yyx990803 yyx990803 added 🍰 p2-nice-to-have Priority 2: this is not breaking anything but nice to have it addressed. and removed 🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. labels Jul 17, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🍰 p2-nice-to-have Priority 2: this is not breaking anything but nice to have it addressed. scope: compiler scope: script-setup scope: sfc
Projects
None yet
Development

No branches or pull requests

2 participants