{"id":13722323,"url":"https://github.com/patoi/svelte-component-library-template","last_synced_at":"2025-05-07T15:30:32.619Z","repository":{"id":36581993,"uuid":"196357168","full_name":"patoi/svelte-component-library-template","owner":"patoi","description":"A base for building Svelte component library.","archived":false,"fork":false,"pushed_at":"2023-01-27T04:02:30.000Z","size":1016,"stargazers_count":66,"open_issues_count":14,"forks_count":6,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-11-14T11:39:59.661Z","etag":null,"topics":["component","library","svelte","sveltejs","template"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/patoi.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-07-11T08:54:35.000Z","updated_at":"2024-06-26T16:11:55.000Z","dependencies_parsed_at":"2023-02-15T05:01:44.423Z","dependency_job_id":null,"html_url":"https://github.com/patoi/svelte-component-library-template","commit_stats":null,"previous_names":[],"tags_count":0,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patoi%2Fsvelte-component-library-template","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patoi%2Fsvelte-component-library-template/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patoi%2Fsvelte-component-library-template/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patoi%2Fsvelte-component-library-template/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/patoi","download_url":"https://codeload.github.com/patoi/svelte-component-library-template/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252905515,"owners_count":21822818,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["component","library","svelte","sveltejs","template"],"created_at":"2024-08-03T01:01:27.402Z","updated_at":"2025-05-07T15:30:32.249Z","avatar_url":"https://github.com/patoi.png","language":"JavaScript","funding_links":[],"categories":["templates"],"sub_categories":["editor tools"],"readme":"![Build Status](https://github.com/patoi/svelte-component-library-template/workflows/Test/badge.svg) [![Dependabot](https://badgen.net/badge/Dependabot/enabled/green?icon=dependabot)](https://dependabot.com/) ![](https://github.com/patoi/svelte-component-library-template/workflows/Auto%20merge%20Dependabot%20updates/badge.svg)\n\n# Svelte Components template\n\n**You can create your own component library to your applications with this template.**\n\nA base for building Svelte component library.\n\nOriginal work is https://github.com/sveltejs/component-template\n\n## Using\n\n**On GitHub:**\n\n`Use this template` button on top right.\n\nRead more: [Creating a repository from a template](https://help.github.com/en/articles/creating-a-repository-from-a-template)\n\n**CLI:**\n\n1. Clone it with [degit](https://github.com/Rich-Harris/degit)\n\n```bash\nnpx degit patoi/svelte-component-library-template svelte-component-library-template\ncd svelte-component-library-template\nnpm install # or yarn\n```\n\n2. Add your component's code to [src/](./src/) as directory, e.g.: [src/HelloComponent/](./src/HelloComponent/) (or add your component directly to [src/](./src/)).\n\n3. Export the new component to apps in [src/index.js](./src/index.js)\n\n4. [src/test.js](./src/test.js) and [src/App.svelte](./src/App.svelte) are for testing purposes:\n\n-   add component to the [src/App.svelte](./src/App.svelte)\n-   add component's properties to [src/test.js](./src/test.js)\n\n4. Create your test cases to your component:\n\n-   add tests to [test/](./test/) directory\n\n## Development\n\n1. `npm install`\n\n2. `npm run dev` :\n\n-   **build components on change** and\n-   **serves** from `public/` directory at `http://localhost:5000`\n-   and **handling livereload**\n\n3. `npm test` : test runner\n\nFor changing the view of the test page use [public/global.css](./public/global.css) and [public/index.html](./public/index.html)\n\n## Using components in app\n\nhttps://github.com/rollup/rollup-plugin-svelte#pkgsvelte\n\n**Tip:** if you are a developer of the _component library,_ then you can install it _once_ as **devDependencies** to app with `npm i -D \u003cpath-to-your-components\u003e` , all change will appear immediately if you use livereload in app.\n\nImport _component library_ into your app in `App.svelte` :\n\n```html\n\u003cscript\u003e\n  import { ByeBye, Hello } from 'svelte-component-library-template'\n  export let name\n\u003c/script\u003e\n\n\u003cHello {name} /\u003e\n\u003cByeBye {name} /\u003e\n```\n\n## Technical background\n\nMore: https://github.com/sveltejs/sapper-template/blob/master/README.md#using-external-components\n\n-   `svelte` https://svelte.dev\n-   `playwright` for testing: https://playwright.dev\n-   `eslint` and `prettier` for formatting and linting\n-   `rollupjs` for bundling: https://rollupjs.org\n\nSupported Node.js v12 LTS and v14 LTS.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpatoi%2Fsvelte-component-library-template","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpatoi%2Fsvelte-component-library-template","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpatoi%2Fsvelte-component-library-template/lists"}