development.md

Development

This guide covers local development workflows for magic-crayon contributors.

Prerequisites

• Node.js (project uses modern ESM tooling)
• npm

Install dependencies from the repository root:

npm install

Local Development

Run the demo app in development mode:

npm run dev

Build

Library build (for npm packaging):

npm run build

Demo build:

npm run build:demo
npm run preview

Testing

Run the test suite:

npm test

Run coverage:

npm run test:coverage

Note: Vitest browser mode is optimized for test execution and reports; use npm run dev or Storybook for visual/manual interaction checks.

Storybook

Run Storybook locally:

npm run storybook

Build static Storybook output:

npm run build-storybook

Quality Checks

Typecheck:

npm run check-types

Lint:

npm run lint

SVG optimization:

npm run svg:optimize

SVG optimization check (fails if SVGs need optimization):

npm run svg:check