Closed treethingy closed 4 months ago
Maybe my understanding of the inspector might be wrong. Perhaps some part of my issue is related to #545 (not being able reach "my" file that contains the sveltestrap component. By adding a surrounding
<script>
import {Button, Column, Table} from "@sveltestrap/sveltestrap";
let rows = [{name: "Hugo"},{name: "Steve"}]
</script>
<Table rows={rows} let:row>
<Column header="Name">
{row.name}
</Column>
</Table>
<Button>Click Me</Button>
When pointing the inspector to the value of "row.name" it currently enters "Column.svlete" of sveltestraps, not it's slot (the {row.name}). So perhaps the solution might not be "filtering" (and therby flattening the hierarchy) but rather not going deep enough?
files in node_modules should already be excluded. https://github.com/sveltejs/vite-plugin-svelte/blob/6c59572951e2f67293b7677ce86176b0c4bce13f/packages/vite-plugin-svelte-inspector/src/runtime/Inspector.svelte#L88
could you check what the filename in svelte_meta is for components that should not show up?
For the second issue, unfortunately svelte inspector can only use data provided by svelte in svelte_meta of elements, this means that individual text nodes like the slot content in your example won't be resolved to the file they are defined in, the closest parent elements file is what you'll get. This is a technical limitation right now.
as explained above this feature already exists. If it doesn't work for you, please file an issue, including a link to a repository with a minimal reproduction.
Describe the problem
The Inspector is awesome when designing "the live thing" together with a client. Since I switched to the sveltestraps library it's almost unusable for me because the inspector always references to the code within the sveltrestraps library, not my code where I wanted to get to make changes. Even navigating to the parent component doesn't work as eypected (I always end up in my +layout.svelte)
Describe the proposed solution
I'd really like some configuration property for ignoring any component that is located within "NodeModules".
Alternatives considered
Not using libraries like svletestraps would be a shame. Perhaps an option to show (and enable selection) of the full hierarchy when an component is selected, but this could get quite messy.
Importance
would make my life easier