# Get Started Read this before you submit your first contribution. ## How to Contribute Take care to read all contributions guidelines before you begin! 1. Learn how to [contribute to open source](https://opensource.guide/how-to-contribute/). 2. Follow a [step-by-step guide](https://github.com/firstcontributions/first-contributions) to practice your first contribution. 3. Locate an [open issue on GitHub](https://github.com/skeletonlabs/skeleton/issues). Post a comment letting us know you wish to volunteer. 4. Optionally, you may coordinate efforts on the `#contributors` channel within [Discord](https://discord.gg/EXqV7W8MtY). 5. A member of the Skeleton team will assign the issue to you and help outline requirements. 6. Complete the work and submit a pull request per the requirements on this page. > NOTE: non-trivial PRs submitted without our prior consent will be denied. Repeat offenders will be blocked. ## Using PNPM Skeleton makes use of [PNPM](https://pnpm.io/) and [PNPM workspaces](https://pnpm.io/workspaces) to maintain all projects within the Skeleton monorepo. 1. [Install PNPM](https://pnpm.io/installation) on your local computer. 2. [Fork the Skeleton monorepo](https://github.com/skeletonlabs/skeleton) via the option on GitHub. 3. Use Git to clone the forked project to your local machine. 4. Run `pnpm i` from the root to install the required dependencies. 5. Point your terminal at one of the `/sites`, `/packages` or `/playgrounds` projects detailed below. 6. Run `pnpm dev` to start a local dev server for each project. ## Monorepo Structure ### Sites Public facing websites that are deployed and hosted for users to browse. \| Path | Description | \| ---------------------------- | --------------------------- | \| `/sites/skeleton.dev` | The documentation website | \| `/sites/themes.skeleton.dev` | The theme generator website | ### Packages Modular Skeleton packages distributed via NPM. \| Path | Description | \| --------------------------- | -------------------------------------------------------------------------- | \| `/packages/skeleton` | The Skeleton core package, contains Skeleton's Tailwind-specific features. | \| `/packages/skeleton-react` | The Skeleton React package, contains Skeleton React components. | \| `/packages/skeleton-svelte` | The Skeleton Svelte package, contains Skeleton Svelte components. | \| `/packages/skeleton-common` | The Skeleton common package, contains shared modules. | \| `/packages/cli` | The Skeleton CLI, contains Skeleton's migrations. | ## Playgrounds Isolated sandbox environments for developing, testing and experimenting. \| Path | Description | \| ------------------------------ | --------------------------------------------------------- | \| `/playgrounds/skeleton-svelte` | A SvelteKit playground for testing the Svelte package | \| `/playgrounds/skeleton-react` | A Tanstack Start playground for testing the React package | ## Branch Create and target all pull requests against the `main` branch unless otherwise instructed. \| Branch | Description | Pull Requests | \| ------ | -------------------------------------------------- | -------------------------------------------------- | \| `main` | Represents the release branch of the all projects. | Allowed | ### PR Branch Conventions Please use the following naming convention when creating your pull request. \| Branch | Role | \| ----------- | ------------------------------------------------------------ | \| `docs/*` | When making edits to the docs. | \| `feature/*` | When adding a new feature. | \| `task/*` | When making changes to the build process or auxiliary tools. | \| `bugfix/*` | When fixing a bug. | Keep branch names short and semantic, and use kebab-case to separate words: ``` docs/get-started-typo bugfix/accordion-render-issue ``` ## Changesets [Changesets](https://github.com/changesets/changesets) are used to automatically generate the changelog for each release. * Any contributions made within `/packages` *must* contain a Changeset * Any contributions made within `/sites` should **not** include a Changeset. Follow these instructions to generate a changeset: 1. Navigate to the root of the Skeleton monorepo. 2. Run `pnpm changeset` to trigger the Changeset CLI. 3. Select the packages that are affected by your changes. 4. Select the type of version bump required (major, minor, patch). 5. Provide a short description of the changes made. Changesets use semantic versioning. We recommend the following convention. \| Version | Role | \| ------- | -------------------------------------------------------------------------- | \| `major` | For breaking changes, such as changing the API of a component or function. | \| `minor` | For notable changes, such as a new feature. | \| `patch` | For small changes, such as a fixing a bug. | Changeset descriptions will appear verbatim on the corresponding CHANGELOG.md. Keep it short, semantic, and and include the same [branch prefix](/docs/\[framework]/resources/contribute/get-started#pr-branch-conventions). ```md --- '@skeletonlabs/skeleton-svelte': minor --- feat: Added `Avatar` component. ``` ## Tooling Skeleton makes use of the following technology to improve the developer experience. It's recommended you run these tools before flagging the PR as "ready for review" on GitHub. ### Root Commands Run the following commands in the monorepo root. Each will run recursively for supported packages. \| Command | Description | Tool | \| ------------- | --------------------- | ------------------------------------------------------------------------------------------------------------------------------ | \| `pnpm format` | Runs the formatter | [Prettier](https://prettier.io/) | \| `pnpm lint` | Runs the linter | [Oxlint](https://oxc.rs/docs/guide/usage/linter) | \| `pnpm test` | Runs all unit tests | [Vitest](https://vitest.dev/) | \| `pnpm check` | Runs the type checker | [TypeScript](https://www.typescriptlang.org/), [Svelte Check](https://svelte.dev/docs) and [Astro Check](https://astro.build/) |