More contribution docs
This commit is contained in:
parent
c78c0bfabb
commit
c336d2e397
1 changed files with 66 additions and 63 deletions
131
CONTRIBUTING.md
131
CONTRIBUTING.md
|
@ -1,102 +1,108 @@
|
||||||
# Contributing to Theatre.js
|
# Contributing to Theatre.js
|
||||||
|
|
||||||
## Getting Started
|
## The quick version
|
||||||
|
|
||||||
|
Have `node 14+` and `yarn 1.22+` installed. Then `git clone` and `yarn install`. Then `cd packages/playground` and `yarn run serve`. Happy hacking!
|
||||||
|
|
||||||
|
## The long version
|
||||||
|
|
||||||
### Prerequisites
|
### Prerequisites
|
||||||
|
|
||||||
Make sure you have [Node](https://nodejs.org/) installed at v14.0.0+
|
Make sure you have [Node](https://nodejs.org/) installed at v14.0.0+
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
node -v
|
$ node -v
|
||||||
|
> v14.0.0
|
||||||
v14.0.0
|
|
||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
and [Yarn](https://classic.yarnpkg.com/en/) at v2.0.0+.
|
and [Yarn](https://classic.yarnpkg.com/en/) at v1.22.10+.
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
yarn -v
|
$ yarn -v
|
||||||
|
> 1.22.10
|
||||||
2.0.0
|
|
||||||
```
|
```
|
||||||
|
|
||||||
|
> **Note about Yarn v2**: This repo uses Yarn v2. You don't have to install yarn v2 globally. If you do have yarn 1.22.10+ installed, and `cd` into `/path/to/theatre`, yarn will automatically switch to v2. Read more about Yarn v2 [here](https://yarnpkg.com/).
|
||||||
|
|
||||||
### Fork, Clone & Install
|
### Fork, Clone & Install
|
||||||
|
|
||||||
Start by forking Theatre.js to your GitHub account. Then clone your fork and
|
Start by forking Theatre.js to your GitHub account. Then clone your fork and install dependencies:
|
||||||
install dependencies:
|
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
git clone git@github.com:<your-user>/theatre.git
|
$ git clone git@github.com:<your-user>/theatre.git
|
||||||
cd theatre
|
$ cd theatre
|
||||||
yarn
|
$ yarn
|
||||||
```
|
```
|
||||||
|
|
||||||
> ⚠ theatre relies on
|
> ⚠ theatre relies on
|
||||||
> [yarn workspaces](https://classic.yarnpkg.com/lang/en/docs/workspaces/) so
|
> [yarn workspaces](https://yarnpkg.com/features/workspaces) so
|
||||||
> `npm install` will not work in this repository.
|
> `npm install` will not work in this repository.
|
||||||
|
|
||||||
Add our repo as a git remote so you can pull/rebase your fork with our latest
|
Add our repo as a git remote so you can pull/rebase your fork with our latest
|
||||||
updates:
|
updates:
|
||||||
|
|
||||||
|
```sh
|
||||||
|
$ git remote add upstream git@github.com:AriaMinaei/theatre.git
|
||||||
```
|
```
|
||||||
git remote add upstream git@github.com:AriaMinaei/theatre.git
|
|
||||||
|
## Start hacking with `playground`
|
||||||
|
|
||||||
|
The quickest way to start tweaking things is to run the `playground` package.
|
||||||
|
|
||||||
|
```sh
|
||||||
|
$ cd ./packages/playground
|
||||||
|
$ yarn serve
|
||||||
```
|
```
|
||||||
|
|
||||||
|
The playground is a bunch of ready-made projects that you can run to experiment with Theatre.js.
|
||||||
|
|
||||||
|
It uses a single ESBuild config to build all of the related packages in one go, so you don't have to run a bunch of build commands.
|
||||||
|
|
||||||
|
Read more at [`./packages/playground/README.md`](./packages/playground/README.md).
|
||||||
|
|
||||||
## Project structure
|
## Project structure
|
||||||
|
|
||||||
> This section is lacking in instructions (PRs welcome!).
|
* `@theatre/core` – The core animation library.
|
||||||
|
* Location: [`./theatre/core`](./theatre/core)
|
||||||
|
* `@theatre/studio` – The visual editor.
|
||||||
|
* Location: [`./theatre/studio`](./theatre/studio)
|
||||||
|
* `@theatre/dataverse` – The reactive dataflow library.
|
||||||
|
* Location: [`./packagtes/dataverse`](./packages/dataverse)
|
||||||
|
* `@theatre/react` – Utilities for using Theatre with React.
|
||||||
|
* Location: [`./packagtes/react`](./packages/react)
|
||||||
|
* `@theatre/r3f` – The react-three-fiber extension.
|
||||||
|
* Location: [`./packagtes/r3f`](./packages/r3f)
|
||||||
|
* `playground` – The quickest way to hack on the internals of Theatre. It bundles all the related packages together with one ESBuild setup.
|
||||||
|
* Location: [`./packagtes/playground`](./packages/playground)
|
||||||
|
* `examples/`
|
||||||
|
* A bunch of examples, using Theatre with [parcel](https://parceljs.org) or [Create react app](create-react-app.dev).
|
||||||
|
|
||||||
### `@theatre/core`
|
|
||||||
|
|
||||||
The core animation library.
|
|
||||||
|
|
||||||
This project is located under [`./theatre/core`](./theatre/core).
|
|
||||||
|
|
||||||
### `@theatre/studio`
|
|
||||||
|
|
||||||
The visual editor.
|
|
||||||
|
|
||||||
This project is located under [`./theatre/studio`](./theatre/studio).
|
|
||||||
|
|
||||||
### Commands
|
### Commands
|
||||||
|
|
||||||
> This list is not updated, you should run `yarn run` to see all scripts.
|
|
||||||
|
|
||||||
#### Root commands
|
#### Root commands
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
yarn playground // run the playground
|
# Run the playground. It's a shortcut for `cd ./playground; yarn run serve`
|
||||||
|
|
||||||
yarn test // run all tests
|
|
||||||
yarn typecheck // TS typechecking
|
|
||||||
```
|
|
||||||
|
|
||||||
#### Theatre workspace commands
|
|
||||||
|
|
||||||
Commands available for the `@theatre` workspace:
|
|
||||||
|
|
||||||
```sh
|
|
||||||
yarn build:js
|
|
||||||
yarn build:js:watch
|
|
||||||
```
|
|
||||||
|
|
||||||
## Devflow
|
|
||||||
|
|
||||||
> This section is lacking in instructions (PRs welcome!).
|
|
||||||
|
|
||||||
When working on changes for the `@theatre` workspace, you want to have a couple
|
|
||||||
of things running concurrently:
|
|
||||||
|
|
||||||
1. Run the playground to verify the changes
|
|
||||||
```
|
|
||||||
yarn playground
|
yarn playground
|
||||||
|
|
||||||
|
# Run all the tests.
|
||||||
|
yarn test
|
||||||
|
|
||||||
|
# Run tests in watch mode.
|
||||||
|
yarn test --watch
|
||||||
|
|
||||||
|
# Typecheck all the packages
|
||||||
|
yarn typecheck
|
||||||
|
|
||||||
|
# Run eslint on the repo
|
||||||
|
yarn lint:all
|
||||||
|
|
||||||
|
# Run eslint and auto fix
|
||||||
|
yarn lint:all --fix
|
||||||
```
|
```
|
||||||
2. Watch and rebuild theatre packages on changes:
|
|
||||||
```sh
|
> Yarn passes all extra parameters to the internal scripts. So, for example, if you wish to run the tests in watch more, you can run `yarn test --watch`.
|
||||||
cd theatre
|
|
||||||
yarn build:js
|
|
||||||
```
|
|
||||||
|
|
||||||
## Workflow
|
## Workflow
|
||||||
|
|
||||||
|
@ -114,9 +120,7 @@ If you have any questions or issues along the way, drop a message in the
|
||||||
|
|
||||||
> This section is lacking in instructions (PRs welcome!).
|
> This section is lacking in instructions (PRs welcome!).
|
||||||
|
|
||||||
The libraries come bundled with typescript definitions with TSDoc (opens new
|
The libraries come bundled with typescript definitions with TSDoc comments. You can explore the API if your editor is configured to display TSDoc comments.
|
||||||
window)comments. You can explore the API if your editor is configured to display
|
|
||||||
TSDoc comments.
|
|
||||||
|
|
||||||
Other references
|
Other references
|
||||||
|
|
||||||
|
@ -125,8 +129,7 @@ Other references
|
||||||
|
|
||||||
## Testing
|
## Testing
|
||||||
|
|
||||||
Run tests during development with `yarn test --watch` to re-run tests on file
|
Run tests during development with `yarn test --watch` to re-run tests on file changes.
|
||||||
changes.
|
|
||||||
|
|
||||||
### Examples
|
### Examples
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue