Skip to content

Setup SFC doesn't compile development with development flag "_file" when component is process for devtools to show setup function #5365

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

Closed
Xenoha opened this issue Feb 7, 2022 · 3 comments

Comments

@Xenoha
Copy link

Xenoha commented Feb 7, 2022

Version

3.2.29

Reproduction link

github.com/antfu/vitesse

Steps to reproduce

Pull the repo, or just follow the getting started steps with pnpm. While I provided the vitesse starting repo, you could use the vite repo as well. See the below for details from both project starts paths.

On Viteese:
If you just do a build with the the standard flow, then do a "pnpm preview" you will see the devtools and your layout will be Anonymous Component and the Page will be Anonymous Component.

On Vite:
Change the the dev script to the following: '"dev": "vite build --watch --mode 'development'"
Open up your chrome devtools and note that the Vue devtools should be present as you changed the mode to "development" When reviewing the component structure of the devtools, none router based components show up as Anonymous Component

What is expected?

The component file name should be visible through the devtools component tree as well as the setup properties.

What is actually happening?

The component is showing up as "Anonymous Component" and the setup method properties are not visible for the component.


Router components are processing fine through the dev tools tree. I submitted an issue on the devtools and the Guillaume Chau gave me the following message.

"Looks like it's an issue with the component compiler. The devtools uses a development-only property __file added to component definitions when the component is processed."

I figured since the core team is in control of the render function and processing, this was the place to submit the issue. Let me know if I need to place the issue to the vite team.

Here is the issue on the vue/devtools board. https://github.com/vuejs/devtools/issues/1564#

You will see a screenshot of the issue and some background as I was trying to figure out how to consistently reproduce.

@LinusBorg
Copy link
Member

@LinusBorg
Copy link
Member

Note we also have ongoing discussions in other issues about how to optimize component name assignment / generation in script setup. (#5218)

@Xenoha
Copy link
Author

Xenoha commented Feb 7, 2022

Thanks @LinusBorg I submitted this to the Vite team and will keep an eye out on #5218

@github-actions github-actions bot locked and limited conversation to collaborators Oct 3, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants