Merge branch 'main' into rti

# Conflicts: # examples/rollup.config.mjs # package.json
playcanvas · May 24, 2024 · 1dafa68 · 1dafa68
2 parents ae4abb8 + 8372868
commit 1dafa68
Show file tree

Hide file tree

Showing 65 changed files with 2,116 additions and 909 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -35,6 +35,9 @@ jobs:
     - name: Build PlayCanvas
       run: npm run build
 
+    - name: Run Publint
+      run: npm run publint
+
   docs:
     name: Docs
     runs-on: ubuntu-latest

diff --git a/.github/workflows/publish.yaml b/.github/workflows/publish.yaml
@@ -3,7 +3,7 @@ name: Publish to npm
 on:
   push:
     tags:
-      - '*'
+      - 'v[0-9]+.[0-9]+.[0-9]+'
 
 jobs:
   publish-npm:
@@ -23,7 +23,10 @@ jobs:
         run: npm install
 
       - name: Build PlayCanvas
-        run: npm run build:publish
+        run: npm run build
+
+      - name: Run Publint
+        run: npm run publint
 
       - name: Publish to npm
         run: npm publish

diff --git a/README.md b/README.md
@@ -40,7 +40,7 @@ PlayCanvas is used by leading companies in video games, advertising and visualiz
 
 PlayCanvas is a fully-featured game engine.
 
-* 🧊 **Graphics** - Advanced 2D + 3D graphics engine built on WebGL 1 & 2.
+* 🧊 **Graphics** - Advanced 2D + 3D graphics engine built on WebGL2 & WebGPU.
 * 🏃 **Animation** - Powerful state-based animations for characters and arbitrary scene properties
 * ⚛️ **Physics** - Full integration with 3D rigid-body physics engine [ammo.js](https://github.com/kripken/ammo.js)
 * 🎮 **Input** - Mouse, keyboard, touch, gamepad and VR controller APIs

diff --git a/examples/assets/models/laboratory.glb b/examples/assets/models/laboratory.glb
diff --git a/examples/assets/models/laboratory.txt b/examples/assets/models/laboratory.txt
@@ -0,0 +1,4 @@
+The Laboratory model has been obtained from this address:
+https://sketchfab.com/3d-models/laboratory-e860e49837c044478db650868866a448
+It's distributed under CC license:
+https://creativecommons.org/licenses/by/4.0/
diff --git a/examples/iframe/example.css b/examples/iframe/example.css
@@ -1,7 +1,9 @@
 body {
     margin: 0;
     overflow-y: hidden;
+    background-color: #000;
 }
+
 #application-canvas {
     width: 100%;
     height: 100%;

diff --git a/examples/iframe/loader.mjs b/examples/iframe/loader.mjs
@@ -119,7 +119,7 @@ class ExampleLoader {
         window.top.pc = window.pc;
 
         // extracts example category and name from the URL
-        const match = /([^/]+)\.html$/.exec(location.href);
+        const match = /([^/]+)\.html$/.exec(new URL(location.href).pathname);
         if (!match) {
             return;
         }

diff --git a/examples/jsconfig.json b/examples/jsconfig.json
@@ -1,20 +1,15 @@
 {
     "compilerOptions": {
-        "checkJs": true,
-        "outDir": "dist",
-        "noImplicitAny": true,
-        "strictNullChecks": true,
-        "module": "esnext",
-        "target": "es2020",
         "allowJs": true,
-        "jsx": "react",
-        "lib": [
-            "es2019",
-            "dom"
-        ],
         "allowSyntheticDefaultImports" : true,
+        "checkJs": true,
         "esModuleInterop" : true,
-        "moduleResolution" : "node"
+        "module": "es6",
+        "moduleResolution": "node",
+        "noImplicitAny": true,
+        "outDir": "dist",
+        "strictNullChecks": true,
+        "target": "es6",
     },
     "include": ["src", "scripts", "iframe", "utils"],
     "exclude": ["node_modules", "src/lib"]

diff --git a/examples/package-lock.json b/examples/package-lock.json
diff --git a/examples/package.json b/examples/package.json
@@ -42,8 +42,7 @@
     "@monaco-editor/react": "^4.5.1",
     "@playcanvas/eslint-config": "^1.5.0",
     "@playcanvas/observer": "1.4.0",
-    "@playcanvas/pcui": "^4.1.2",
-    "@rollup/plugin-alias": "^4.0.4",
+    "@playcanvas/pcui": "^4.3.0",
     "@rollup/plugin-commonjs": "^22.0.2",
     "@rollup/plugin-node-resolve": "^13.3.0",
     "@rollup/plugin-replace": "^4.0.0",
@@ -61,7 +60,7 @@
     "playcanvas": "file:..",
     "prop-types": "^15.7.2",
     "puppeteer": "^20.9.0",
-    "react": "^18.2.0",
+    "react": "^18.3.1",
     "react-dom": "^18.2.0",
     "react-es6": "^1.0.0",
     "react-router-dom": "^5.3.4",

diff --git a/examples/rollup.config.mjs b/examples/rollup.config.mjs
@@ -3,17 +3,17 @@ import path from 'path';
 import { execSync } from 'child_process';
 
 // 1st party Rollup plugins
-import alias from '@rollup/plugin-alias';
-import commonjs from "@rollup/plugin-commonjs";
+import commonjs from '@rollup/plugin-commonjs';
 import replace from '@rollup/plugin-replace';
-import resolve from "@rollup/plugin-node-resolve";
+import resolve from '@rollup/plugin-node-resolve';
 import terser from '@rollup/plugin-terser';
 
 // custom plugins
 import { copyStatic } from './utils/plugins/rollup-copy-static.mjs';
 import { generateStandalone } from './utils/plugins/rollup-generate-standalone.mjs';
 
 // engine rollup utils
+import { treeshakeIgnore } from '../utils/plugins/rollup-treeshake-ignore.mjs';
 import { buildTarget } from '../utils/rollup-build-target.mjs';
 import { buildTargetRTI } from '../utils/rollup-build-target-rti.mjs';
 
@@ -22,12 +22,7 @@ import { isModuleWithExternalDependencies } from './utils/utils.mjs';
 
 const NODE_ENV = process.env.NODE_ENV ?? '';
 const ENGINE_PATH = !process.env.ENGINE_PATH && NODE_ENV === 'development' ?
-    '../src/index.js' :
-    process.env.ENGINE_PATH ?? '';
-
-const PCUI_PATH = process.env.PCUI_PATH || 'node_modules/@playcanvas/pcui';
-const PCUI_REACT_PATH = path.resolve(PCUI_PATH, 'react');
-const PCUI_STYLES_PATH = path.resolve(PCUI_PATH, 'styles');
+    '../src/index.js' : process.env.ENGINE_PATH ?? '';
 const { RTI = '' } = process.env;
 
 const STATIC_FILES = [
@@ -53,7 +48,11 @@ const STATIC_FILES = [
     { src: '../build/playcanvas.d.ts', dest: 'dist/playcanvas.d.ts' },
 
     // playcanvas observer
-    { src: './node_modules/@playcanvas/observer/dist/index.mjs', dest: 'dist/iframe/playcanvas-observer.mjs', once: true },
+    {
+        src: './node_modules/@playcanvas/observer/dist/index.mjs',
+        dest: 'dist/iframe/playcanvas-observer.mjs',
+        once: true
+    },
 
     // modules (N.B. destination folder is 'modules' as 'node_modules' are automatically excluded by git pages)
     { src: './node_modules/monaco-editor/min/vs', dest: 'dist/modules/monaco-editor/min/vs', once: true },
@@ -88,14 +87,7 @@ function checkAppEngine() {
     // types
     if (!fs.existsSync('../build/playcanvas.d.ts')) {
         const cmd = `npm run build target:types --prefix ../`;
-        console.log("\x1b[32m%s\x1b[0m", cmd);
-        execSync(cmd);
-    }
-
-    // engine
-    if (!fs.existsSync('../build/playcanvas/src/index.js')) {
-        const cmd = `npm run build target:esm:release:unbundled --prefix ../`;
-        console.log("\x1b[32m%s\x1b[0m", cmd);
+        console.log('\x1b[32m%s\x1b[0m', cmd);
         execSync(cmd);
     }
 }
@@ -113,33 +105,39 @@ function getEngineTargets() {
     }
     if (NODE_ENV === 'production') {
         // Outputs: dist/iframe/playcanvas.mjs
-        targets.push(...buildTarget({
-            moduleFormat: 'esm',
-            buildType: 'release',
-            bundleState: 'unbundled',
-            input: '../src/index.js',
-            dir: 'dist/iframe'
-        }));
+        targets.push(
+            ...buildTarget({
+                moduleFormat: 'esm',
+                buildType: 'release',
+                bundleState: 'unbundled',
+                input: '../src/index.js',
+                dir: 'dist/iframe'
+            })
+        );
     }
     if (NODE_ENV === 'production' || NODE_ENV === 'development') {
         // Outputs: dist/iframe/playcanvas.dbg.mjs
-        targets.push(...buildTarget({
-            moduleFormat: 'esm',
-            buildType: 'debug',
-            bundleState: 'unbundled',
-            input: '../src/index.js',
-            dir: 'dist/iframe'
-        }));
+        targets.push(
+            ...buildTarget({
+                moduleFormat: 'esm',
+                buildType: 'debug',
+                bundleState: 'unbundled',
+                input: '../src/index.js',
+                dir: 'dist/iframe'
+            })
+        );
     }
     if (NODE_ENV === 'production' || NODE_ENV === 'profiler') {
         // Outputs: dist/iframe/playcanvas.prf.mjs
-        targets.push(...buildTarget({
-            moduleFormat: 'esm',
-            buildType: 'profiler',
-            bundleState: 'unbundled',
-            input: '../src/index.js',
-            dir: 'dist/iframe'
-        }));
+        targets.push(
+            ...buildTarget({
+                moduleFormat: 'esm',
+                buildType: 'profiler',
+                bundleState: 'unbundled',
+                input: '../src/index.js',
+                dir: 'dist/iframe'
+            })
+        );
     }
     return targets;
 }
@@ -149,16 +147,13 @@ export default [
         // used as a placeholder
         input: 'src/static/index.html',
         output: {
-            file: `cache/output.tmp`
+            file: 'cache/output.tmp'
         },
         watch: {
             skipWrite: true
         },
         treeshake: false,
-        plugins: [
-            generateStandalone(NODE_ENV, ENGINE_PATH, RTI),
-            copyStatic(NODE_ENV, STATIC_FILES)
-        ]
+        plugins: [generateStandalone(NODE_ENV, ENGINE_PATH, RTI), copyStatic(NODE_ENV, STATIC_FILES)]
     },
     {
         // A debug build is ~2.3MB and a release build ~0.6MB
@@ -167,23 +162,18 @@ export default [
             dir: 'dist',
             format: 'umd'
         },
+        treeshake: 'smallest',
         plugins: [
-            alias({
-                entries: {
-                    // define supported module overrides
-                    '@playcanvas/pcui/react': PCUI_REACT_PATH,
-                    '@playcanvas/pcui/styles': PCUI_STYLES_PATH
-                }
-            }),
             commonjs(),
+            treeshakeIgnore([/@playcanvas\/pcui/g]), // ignore PCUI treeshake
             resolve(),
             replace({
                 values: {
-                    'process.env.NODE_ENV': JSON.stringify(NODE_ENV)
+                    'process.env.NODE_ENV': JSON.stringify(NODE_ENV) // for REACT bundling
                 },
                 preventAssignment: true
             }),
-            (NODE_ENV === 'production' && terser())
+            NODE_ENV === 'production' && terser()
         ]
     },
     ...getEngineTargets()

diff --git a/examples/src/app/components/DeviceSelector.mjs b/examples/src/app/components/DeviceSelector.mjs
@@ -1,14 +1,12 @@
-// Don't include all of 'playcanvas' for these defines, it just
-// causes bigger bundles and prolongs the build time by ~3s.
-import {
-    DEVICETYPE_WEBGL2,
-    DEVICETYPE_WEBGPU,
-    DEVICETYPE_NULL
-} from 'playcanvas';
 import { Component } from 'react';
 import { SelectInput } from '@playcanvas/pcui/react';
 
 import { jsx } from '../jsx.mjs';
+import {
+    DEVICETYPE_WEBGPU,
+    DEVICETYPE_WEBGL2,
+    DEVICETYPE_NULL
+} from '../constants.mjs';
 import '../events.js';
 
 const deviceTypeNames = {

diff --git a/examples/src/app/constants.mjs b/examples/src/app/constants.mjs
@@ -1 +1,7 @@
 export const MIN_DESKTOP_WIDTH = 601;
+
+export const DEVICETYPE_WEBGL2 = 'webgl2';
+
+export const DEVICETYPE_WEBGPU = 'webgpu';
+
+export const DEVICETYPE_NULL = 'null';