WebGPU 游戏项目初始化 - 添加基础配置文件和源代码

src/main.ts

@@ -0,0 +1,62 @@
+class Renderer{
+  private device! : GPUDevice;
+  private context! : GPUCanvasContext;
+
+  public async initialize()
+  {
+    const canvas = document.getElementById('canvas') as HTMLCanvasElement;
+    
+    this.context = canvas.getContext('webgpu')!;
+
+    if(!this.context){
+      alert('WebGPU not supported');
+      return;
+    }
+
+    const adapter = await navigator.gpu.requestAdapter(
+      {
+        powerPreference: 'low-power'
+      }
+    );
+
+    if(!adapter)
+      {
+        alert('No WebGPU adapter found');
+        return;
+      }
+
+    this.device = await adapter.requestDevice()
+
+    this.context.configure({
+      device: this.device,
+      format: navigator.gpu.getPreferredCanvasFormat()
+    })
+
+  }
+
+  public draw()
+  {
+    const commandEncoder = this.device.createCommandEncoder();  
+    const textureView = this.context.getCurrentTexture().createView();  
+
+    const renderPassDescriptor:GPURenderPassDescriptor = {
+      colorAttachments:[{
+        view: textureView,
+        clearValue: {r: 1, g: 0, b: 0, a: 1},
+        loadOp: 'clear',
+        storeOp:'store'
+      }]
+      }  
+
+    const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); 
+
+    passEncoder.end();
+
+    this.device.queue.submit([commandEncoder.finish()]);
+  }
+  
+}
+
+const renderer = new Renderer();
+renderer.initialize()
+  .then(()=> renderer.draw());