Package Exports
- svelte-dev-helper
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (svelte-dev-helper) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
svelte-dev-helper
Helper for svelte components to ease development. Used under the hood by svelte-loader.
Usage
This is meant to be used under the hood for creating a build toolchain, or a dev helper based on Svelte components.
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:
- Adds a
<!--<Component>-->
comment marker in the DOM just above where the component's DOM starts - You can access the component instance using
$0.__component__
in devtools after higlighting the comment marker from above. - You can access all rendered instances of a particular component using
Registry.get(id).instances
- All instances have a
_rerender
method - If you switch the
component
in the registry (usingRegistry.set(id, Registry.get(id).component = newComponent)
) all future renders of the component will use the newly switched component. - Following a switch as per above, you can switch all rendered components by first accessing the instances and then calling
_rerender
on them. - The
rollback
property in anyRegistry
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 inrollback
The Registry
is also available at window.__SVELTE_REGISTRY__