Keep WebGLRenderer as the default, add 'npm run start:webgpu' command…

… to use WebGPURenderer

package.json

@@ -27,6 +27,7 @@
     "prerelease": "node scripts/release.js 1.5.0 1.6.0",
     "start": "npm run dev",
     "start:https": "npm run dev -- --server-type https",
+    "start:webgpu": "cross-env WEBGPU=true npm run dev -- --server-type https",
     "test": "karma start ./tests/karma.conf.js",
     "test:docs": "node scripts/docsLint.js",
     "test:firefox": "npm test -- --browsers Firefox",

src/core/scene/a-scene.js

@@ -547,8 +547,10 @@ export class AScene extends AEntity {
       };
     }
 
-    renderer = this.renderer = new THREE.WebGPURenderer(rendererConfig);
-    renderer.xr.setPoseTarget = function () {};
+    renderer = this.renderer = new (THREE.WebGLRenderer || THREE.WebGPURenderer)(rendererConfig);
+    if (!renderer.xr.setPoseTarget) {
+      renderer.xr.setPoseTarget = function () {};
+    }
     renderer.setPixelRatio(window.devicePixelRatio);
 
     if (this.camera) { renderer.xr.setPoseTarget(this.camera.el.object3D); }

src/lib/three.js

@@ -1,5 +1,5 @@
 // eslint-disable-next-line import/extensions
-import * as SUPER_THREE from 'three/webgpu';
+import * as SUPER_THREE from 'three';
 import { DRACOLoader } from 'three/addons/loaders/DRACOLoader.js';
 import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
 import { KTX2Loader } from 'three/addons/loaders/KTX2Loader.js';

webpack.common.cjs

@@ -1,6 +1,7 @@
+var path = require('path');
 var webpack = require('webpack');
 
-module.exports = {
+var config = {
   entry: './src/index.js',
   devtool: 'source-map',
   plugins: [
@@ -28,3 +29,13 @@ module.exports = {
     ]
   }
 };
+
+if (process.env.WEBGPU === 'true') {
+  config.resolve = {
+    alias: {
+      'three$': path.resolve(__dirname, 'node_modules/three/build/three.webgpu.js')
+    }
+  };
+}
+
+module.exports = config;