https://github.com/6edesign/svelte-router
A svelte router with code splitting
https://github.com/6edesign/svelte-router
Last synced: about 1 year ago
JSON representation
A svelte router with code splitting
- Host: GitHub
- URL: https://github.com/6edesign/svelte-router
- Owner: 6eDesign
- Created: 2019-01-26T07:44:19.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2020-07-13T22:04:48.000Z (almost 6 years ago)
- Last Synced: 2025-03-14T05:45:59.105Z (about 1 year ago)
- Language: HTML
- Size: 549 KB
- Stars: 6
- Watchers: 3
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# svelte-router
A little router component that uses code splitting for components. Uses page.js (~2kb min/gzip) for routing.
## A Work in Progress:
I'm not entirely sure this is useful yet and it has not been published to NPM at this time.
## How to use:
With Svelte v3:
```html
import { Router, Route } from '6edesign/svelte-router';
import('./HomeRoute.svelte')}
/>
import('./RegexRoute.svelte')}
/>
import('./NamedParamsRoute.svelte')}
/>
```
(Minimal) Rollup Config Example:
```js
import svelte from "rollup-plugin-svelte";
import resolve from "rollup-plugin-node-resolve";
import commonjs from "rollup-plugin-commonjs";
import { terser } from "rollup-plugin-terser";
const test = {
input: "src/app.js",
output: {
sourcemap: true,
format: "es",
dir: 'public/module'
},
experimentalCodeSplitting: true,
plugins: [
svelte({
nestedTransitions: true,
dev: false,
css: css => {
css.write("public/app.css");
}
}),
resolve(),
commonjs()
]
};
export default [test];
```
## Contributing to this project
Clone & install the dependencies...
```bash
cd svelte-router
npm install
```
...then start [Rollup](https://rollupjs.org):
```bash
npm run dev
```