Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/NekitCorp/chrome-extension-svelte-typescript-boilerplate
Boilerplate for Chrome Extension Svelte Typescript project
https://github.com/NekitCorp/chrome-extension-svelte-typescript-boilerplate
boilerplate chrome-extension svelte typescript vite
Last synced: 3 months ago
JSON representation
Boilerplate for Chrome Extension Svelte Typescript project
- Host: GitHub
- URL: https://github.com/NekitCorp/chrome-extension-svelte-typescript-boilerplate
- Owner: NekitCorp
- Created: 2020-10-08T07:07:12.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2024-10-23T15:53:12.000Z (3 months ago)
- Last Synced: 2024-10-23T19:14:35.956Z (3 months ago)
- Topics: boilerplate, chrome-extension, svelte, typescript, vite
- Language: TypeScript
- Homepage:
- Size: 939 KB
- Stars: 250
- Watchers: 5
- Forks: 51
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-opensource-boilerplates - chrome extension svelte-typescript boilerplate - Boilerplate for Chrome Extension Svelte Typescript project. (Browser Extensions)
README
# Svelte Typescript Chrome Extension Boilerplate
> Boilerplate for Chrome Extension Svelte Typescript project
## Features
- [Svelte](https://svelte.dev/)
- [TypeScript](https://www.typescriptlang.org/)
- [Vite](https://vitejs.dev/)
- [CRXJS Vite Plugin](https://github.com/crxjs/chrome-extension-tools/blob/main/packages/vite-plugin/README.md)
- [Chrome Extensions Manifest V3](https://developer.chrome.com/docs/extensions/mv3/intro/)## Examples of integrations
- [Tailwind CSS](https://tailwindcss.com/) – is in the [tailwindcss](https://github.com/NekitCorp/chrome-extension-svelte-typescript-boilerplate/tree/tailwindcss) branch
## Development
```bash
# install dependencies
npm i# build files to `/dist` directory
# HMR for extension pages and content scripts
npm run dev
```## Build
```bash
# build files to `/dist` directory
$ npm run build
```## Load unpacked extensions
[Getting Started Tutorial](https://developer.chrome.com/docs/extensions/mv3/getstarted/)
1. Open the Extension Management page by navigating to `chrome://extensions`.
2. Enable Developer Mode by clicking the toggle switch next to `Developer mode`.
3. Click the `LOAD UNPACKED` button and select the `/dist` directory.![Example](https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/vOu7iPbaapkALed96rzN.png?auto=format&w=571)