Helper for svelte components to ease development
npm install svelte-dev-helper
Helper for svelte components to ease development.
Used under the hood by svelte-loader.
This is meant to be used under the hood for creating a build toolchain, or a dev helper based on Svelte components.
``js
import {Registry, configure, createProxy} from 'svelte-dev-helper';
import Component from './Component.html'; //some svelte component
configure(configOptions);
const id = someUniqueID();
Registry.set(id, {
rollback: null,
component: Component,
instances:[]
});
export createProxy(id);
`
The component returned by createProxy now has the following features:
1. Adds a comment marker in the DOM just above where the component's DOM starts$0.__component__
2. You can access the component instance using in devtools after higlighting the comment marker from above.Registry.get(id).instances
3. You can access all rendered instances of a particular component using _rerender
4. All instances have a methodcomponent
4. If you switch the in the registry (using Registry.set(id, Registry.get(id).component = newComponent)) all future renders of the component will use the newly switched component._rerender
5. Following a switch as per above, you can switch all rendered components by first accessing the instances and then calling on them.rollback
6. The property in any Registry item can be used to hold the last good version of a component. If there is an error instantiating a switched component, it will try to use the component version stored in rollback
The Registry is also available at window.__SVELTE_REGISTRY__`