https://github.com/abrahamspaa/wc-svelte-clock
https://github.com/abrahamspaa/wc-svelte-clock
Last synced: about 1 year ago
JSON representation
- Host: GitHub
- URL: https://github.com/abrahamspaa/wc-svelte-clock
- Owner: abrahamspaa
- Created: 2021-05-16T06:54:07.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2021-05-16T09:49:37.000Z (about 5 years ago)
- Last Synced: 2023-07-21T05:39:19.382Z (about 3 years ago)
- Language: JavaScript
- Homepage: https://abrahamspaa.github.io/wc-svelte-clock/
- Size: 31.3 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# svelte app
This is a project template for [Svelte](https://svelte.dev) apps. It lives at https://github.com/sveltejs/template.
To create a new project based on this template using [degit](https://github.com/Rich-Harris/degit):
```bash
npx degit sveltejs/template svelte-app
cd svelte-app
```
*Note that you will need to have [Node.js](https://nodejs.org) installed.*
## How it was build
1. Create svelte app
```js
npx degit sveltejs/template wc-svelte-clock
```
2. install the app
```bash
cd wc-svelte-clock && yarn
```
3. Add clock in `App.svelte` taken from [clock](https://svelte.dev/repl/clock?version=3.38.2)
4. Add `customElement: true` inside rollup.config.js
5. Create `svelte:options` inside `App.svelte`
```html
```
6. Remove unwanted code in main.js
7. To test in local add below in `public/index.html`
```html
```
## How to publish in github
1. Create folder as docs
```bash
mkdir docs && touch docs/index.html
```
2. Bundle up
```bash
yarn build
```
3. Copy public/build/bundle.js to docs/bundle.js
## Reference
- https://itnext.io/svelte-web-component-5-4kb-4afe46590d99
- https://docs.github.com/en/pages/getting-started-with-github-pages/configuring-a-publishing-source-for-your-github-pages-site