p5.js Template PETR

Other languages (wiki): [ ja ]

About

Template project for creating p5.js sketches using the following tools:

In general, the below only need to be done once.

Install the software as follows:
- Visual Studio Code (VS Code in short)
- Node.js
Install the VS Code extensions as follows:
- Prettier - Code formatter
  (from CLI: code --install-extension esbenp.prettier-vscode)
- ESLint
  (from CLI: code --install-extension dbaeumer.vscode-eslint)

Do the below each time you start to create a new sketch using this template.

Create your sketch folder by copying this template.
Open your sketch folder with VS Code.
Then run the following command-line, which installs several package dependencies:
```
npm install
```
Enable the VS Code extensions for Prettier and ESLint (see above), if disabled.

Now Prettier and ESLint work automatically each time you edit/save your code.
If they seem to be not working, reload window of VS Code.

Edit code in src directory.
- If you rename main.ts, you should reflected that in rollup.config.js as well.
- Feel free to change anything else.
Run the following command-line:
```
npm run build
```
This will first generate *.js files (transpiled from *.ts files) in tsc-out directory, then bundle them and save as dist/script.js.
Open dist/index.html to see the result.