Toolverse
All skills

browser-extension-developer

by yamadashy

Use this skill when developing or maintaining browser extension code in the `browser/` directory, including Chrome/Firefox/Edge compatibility, content scripts, background scripts, or i18n updates.

Installation

Pick a client and clone the repository into its skills directory.

Installation

Quick info

Author
yamadashy
Category
Frontend
Views
32

About this skill

Use this skill when developing or maintaining browser extension code in the browser/ directory, including Chrome/Firefox/Edge compatibility, content scripts, background scripts, or i18n updates.

How to use

  1. Przejdź do katalogu browser/ w projekcie, gdzie znajduje się struktura rozszerzenia z plikami konfiguracyjnymi WXT i skryptami entrypoints.

  2. Aby rozpocząć pracę w trybie deweloperskim dla Chrome, uruchom npm run dev — rozszerzenie będzie się automatycznie przebudowywać przy zmianach kodu.

  3. Jeśli rozwijasz dla Firefox, użyj npm run dev:firefox zamiast domyślnego polecenia Chrome.

  4. Edytuj skrypty w katalogu entrypoints/ (background.ts dla logiki tła, content.ts dla skryptów wstrzykiwanych na strony) oraz pliki lokalizacji w public/_locales/ dla każdego z 12 obsługiwanych języków.

  5. Przed ukończeniem pracy uruchom npm run lint i npm run test, aby sprawdzić jakość kodu i poprawność funkcjonalności.

  6. Aby zbudować rozszerzenie dla wszystkich przeglądarek naraz, wykonaj npm run build-all — wyniki trafią do katalogu .output/ z osobnymi wersjami dla Chrome (MV3), Firefox (MV2) i Edge.

Related skills

shadcn-ui-setup

by maneeshanif

Install and configure Shadcn/ui component library with Radix UI primitives, Aceternity UI effects, set up components, and manage the component registry. Use when adding Shadcn/ui to a Next.js project or installing specific UI components for Phase 2.

Frontend
23167

svg-precision

by dkyazzentwatwa

Deterministic SVG generation, validation, and rendering. Use for icons, diagrams, charts, UI mockups, or technical drawings requiring structural correctness and cross-viewer compatibility.

Frontend
233466

2d-games

by davila7

2D game development principles. Sprites, tilemaps, physics, camera.

Frontend
2674

markitdown

by K-Dense-AI

Convert various file formats (PDF, Office documents, images, audio, web content, structured data) to Markdown optimized for LLM processing. Use when converting documents to markdown, extracting text from PDFs/Office files, transcribing audio, performing OCR on images, extracting

Frontend
75173

theme-factory

by anthropics

Toolkit for styling artifacts with a theme. These artifacts can be slides, docs, reportings, HTML landing pages, etc. There are 10 pre-set themes with colors/fonts that you can apply to any artifact that has been creating, or can generate a new theme on-the-fly.

Frontend
40139

zustand

by lobehub

Zustand state management guide. Use when working with store code (src/store/**), implementing actions, managing state, or creating slices. Triggers on Zustand store development, state management questions, or action implementation.

Frontend
36126