How to write custom vertex shader using NodeMaterial and WebGPURenderer?

Questions
,
1

In case of WebGLRenderer，I can create a highly customized mesh with BufferGeometry and ShaderMaterial. But with WebGPURenderer, it seems that ShaderMaterial is not working and it’s recommended to use NodeMaterial. But I can’t find a detailed tutorial about NodeMaterial. I want to use my own data and shader code, including vertices, indices and other attributes. Just like these code, but in WebGPURenderer and WGSL. Thank you for any help

const geometry = new THREE.BufferGeometry();
const vertices = new Float32Array([
   -1.0, -1.0,  0.0,
   1.0, -1.0,  0.0,
   1.0,  1.0,  0.0,
   -1.0,  1.0,  0.0
]);
geometry.setAttribute('position', new THREE.BufferAttribute(vertices, 3));
const uvs = new Float32Array([
  0.0, 0.0,
  1.0, 0.0,
  1.0, 1.0,
  0.0, 1.0
]);
geometry.setAttribute('uv', new THREE.BufferAttribute(uvs, 2));

const vertexShader = `
   varying vec2 vUv;
   void main() {
      vUv = uv;
      gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
   }
`;

const fragmentShader = `
   varying vec2 vUv;
   void main() {
      gl_FragColor = vec4(vUv, 0.0, 1.0);
   }
`;

const material = new THREE.ShaderMaterial({
   vertexShader: vertexShader,
   fragmentShader: fragmentShader,
   uniforms: {},
   attributes: {
      uv: { type: 'v2', value: uvs }
   }
});

const mesh = new THREE.Mesh(geometry, material);