WebGL examples using TypeScript and webgl-operate.
In order to setup a new example, let's say new-renderer
, the following steps are recommended:
- Copy and paste the
source/test-renderer
directory which is intended as template for examples. - Rename the copied folder to, e.g.,
source/new-renderer
. - Rename the main renderer class accordingly, e.g.,
testrenderer.ts
tonewrenderer.ts
. - Adjust the the
source/new-renderer/example.ts
according to your needs. - Extend the entry property in
webpack.config.js
, e.g., by adding
new-renderer': ['require.ts', 'new-renderer/example.ts']
. - Add and adjust the associated website, e.g., by copying and renaming
website/test-renderer.pug
towebsite/new-renderer.pug
. - Finally, add an entry to
website/examples.json
in the root directoy, e.g.,new-renderer
.
Running build
will transpile all sources and example websites to the ./build
directory. The new renderer should result in a ./build/new-renderer.js
and ./build/new-renderer.html
.
Running start
or start-watch
enables localhost:4000/new-renderer.html
to be accessed and debugged.
Please note that we try to reduce these steps in the near future, e.g., by providing a script for these steps.