An example project that demonstrates how to use Theatre.js to animate your objects in PlayCanvas:
PlayCanvas 3D HTML5 Game Engine
Edit:
For those wondering how I bundled Theatre:
I exposed the studio, and t to window in index.js:
import { getProject, types as t } from "@theatre/core";
import studio from "@theatre/studio";
window.getProject = getProject;
window.studio = studio;
window.t = t;
Then bundled with rollup:
rollup.config.js
import { nodeResolve } from '@rollup/plugin-node-resolve';
import { babel } from '@rollup/plugin-babel';
import commonjs from '@rollup/plugin-commonjs';
import replace from '@rollup/plugin-replace';
import { terser } from "rollup-plugin-terser";
export default {
input: 'src/index.js',
output: {
file: 'build/bundle.js',
format: 'iife'
},
// sourceMap: 'inline',
plugins: [
nodeResolve({
jsnext: true,
main: true,
browser: true,
}),
commonjs(),
// doesn't work with redux for some reason =(
replace({
'process.env.NODE_ENV': JSON.stringify('production')
}),
babel({
exclude: 'node_modules/**'
}),
// mangling the studio breaks it :/, client is ok though
// terser()
],
};