feat(ts-plugins): Add webgpu transform

.github/workflows/test.yml

@@ -12,17 +12,17 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [18]
+        node-version: [22]
 
     steps:
       - uses: actions/checkout@v2.1.1
 
-      - uses: c-hive/gha-yarn-cache@v1
-
       - name: Set up Node ${{ matrix.node-version }}
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
+          cache: yarn
+          cache-dependency-path: yarn.lock
 
       - name: Bootstrap
         run: |
@@ -38,4 +38,4 @@ jobs:
         uses: coverallsapp/github-action@master
         with:
           github-token: ${{ secrets.GITHUB_TOKEN }}
-          path-to-lcov: ${{ github.workspace }}/coverage/lcov.info
+          path-to-lcov: ${{ github.workspace }}/coverage/lcov.info

modules/dev-tools/src/configuration/get-esbuild-config.ts

@@ -68,7 +68,7 @@
 }
 
 /** Returns esbuild config for building .cjs bundles */
 export async function getCJSExportConfig(opts: {
   input: string;
   output: string;
 }): Promise<BuildOptions> {
@@ -81,6 +81,7 @@
     target: 'node16',
     packages: 'external',
     sourcemap: true,
+    sourcesContent: false,
     logLevel: 'info'
   };
 }
@@ -103,7 +104,7 @@
 export async function getBundleConfig(opts: BundleOptions): Promise<BuildOptions> {
   // This script must be executed in a submodule's directory
   const packageRoot = process.cwd();
   const packageInfo = JSON.parse(fs.readFileSync(join(packageRoot, 'package.json'), 'utf-8'));
   const projectRoot = dirname(packageRoot).endsWith('modules')
     ? join(packageRoot, '../..')
     : packageRoot;
@@ -128,7 +129,7 @@
     sourcemap = false
   } = opts;
 
   let externalPackages = Object.keys(packageInfo.peerDependencies || {});
   if (typeof externals === 'string') {
     externalPackages = externalPackages.concat((externals as string).split(','));
   } else if (Array.isArray(externals)) {
@@ -177,7 +178,7 @@
       break;
   }
   if (externalGlobals) {
     config.plugins!.unshift(ext.externalGlobalPlugin(externalGlobals));
   }
 
   if (debug) {
@@ -186,7 +187,7 @@
       plugins: config.plugins!.map((item) => {
         return {
           name: item.name,
           options: externalGlobals
         };
       })
     };

modules/ts-plugins/docs/ts-transform-webgpu.md

@@ -0,0 +1,82 @@
+# WebGPU transform
+
+`@vis.gl/ts-plugins/ts-transform-webgpu` produces either WebGPU-enabled JavaScript or a
+WebGL-only variant from the same TypeScript sources. WebGL-only builds replace WebGPU-specific
+expressions with constants and stubs so that downstream minifiers and tree-shakers can remove
+unreachable code and shader sources.
+
+## Configuration
+
+Add the transform to `compilerOptions.plugins`:
+
+```json
+{
+  "compilerOptions": {
+    "plugins": [
+      {
+        "transform": "@vis.gl/ts-plugins/ts-transform-webgpu",
+        "webGPUEnabled": false
+      }
+    ]
+  }
+}
+```
+
+`webGPUEnabled` defaults to `false`. Set it to `true` for a full WebGPU-enabled build and to
+`false` for a WebGL-only build.
+
+## Transformations
+
+The identifier `__WEBGPU_ENABLED` is replaced with the configured boolean:
+
+```ts
+const isWebGPUEnabled = __WEBGPU_ENABLED;
+```
+
+When `webGPUEnabled` is `false`, the transform also:
+
+- Replaces `device.type === 'webgpu'` and `<expression>.device.type === 'webgpu'` with `false`.
+- Replaces template literals immediately preceded by `/* wgsl */` with `null`, including
+  interpolated templates.
+- Rewrites JavaScript values exported from files ending in `.wgsl.ts`. Exported variables become
+  `null`, and exported functions become `() => null`. Exported type aliases and interfaces remain
+  available to TypeScript declaration emit.
+
+For example:
+
+```ts
+const source = /* wgsl */ `
+  @vertex fn main() {}
+`;
+
+const backend = device.type === 'webgpu' ? webgpuBackend : webglBackend;
+```
+
+becomes:
+
+```ts
+const source = null;
+const backend = webglBackend;
+```
+
+The transform folds conditional expressions whose condition is a literal boolean. It also folds
+conditions that reference a `const` initialized directly to `true` or `false`:
+
+```ts
+const isWebGPU = false;
+const backend = isWebGPU ? webgpuBackend : webglBackend;
+```
+
+becomes:
+
+```ts
+const isWebGPU = false;
+const backend = webglBackend;
+```
+
+## Scope
+
+This transform operates during TypeScript JavaScript emit. It does not change application runtime
+feature detection, package exports, declaration routing, or bundler configuration. Build tooling is
+responsible for selecting `webGPUEnabled`, placing each output in the appropriate package
+directory, and exposing it through package metadata.

modules/ts-plugins/package.json

@@ -39,6 +39,10 @@
     "./ts-transform-inline-webgl-constants": {
       "require": "./dist/ts-transform-inline-webgl-constants/index.cjs",
       "import": "./dist/ts-transform-inline-webgl-constants/index.js"
+    },
+    "./ts-transform-webgpu": {
+      "require": "./dist/ts-transform-webgpu/index.cjs",
+      "import": "./dist/ts-transform-webgpu/index.js"
     }
   },
   "types": "./dist/index.d.ts",