小编Bak*_*akr的帖子

我看到了以下解决方案：

import { ReactComponent as Img } from 'path/to/file.svg'

但在 Gatsby 中，这行不通。我知道存在用于此的插件，但也许可以更轻松地完成。

我正在尝试将着色器与 React-三纤维和 Typescript 一起使用。着色器文件：

import { ShaderMaterial } from "three"
import { extend } from "react-three-fiber"

class CustomMaterial extends ShaderMaterial {
  constructor() {
    super({
      vertexShader: `...`,
      fragmentShader: `...`,
      uniforms: [...]
    })
  }
}

extend({ CustomMaterial })

和组件文件：

<mesh
  key={el.name}
  material={el.material}
  receiveShadow
  castShadow
>
  <bufferGeometry attach="geometry" {...el.geometry} />
  <customMaterial attach="material" />
</mesh>

我收到错误：

类型“JSX.IntrinsicElements”上不存在属性“customMaterial”。

我正在尝试将纹理用于我的 ThreeJS 对象。我收到错误：

index.js:1 Error: Earth suspended while rendering, but no fallback UI was specified.

Add a <Suspense fallback=...> component higher in the tree to provide a loading indicator or placeholder to display.
    in Earth

地球.js：

export const Earth = () => {
    const texture = useLoader(THREE.TextureLoader, earthImg)

    return (
        <Suspense fallback={<h1>Loading profile...</h1>}>
            <mesh>
                <sphereBufferGeometry attach="geometry" args={[5, 32, 32]} />
                <meshStandardMaterial attach="material"  roughness={1} fog={false} />
            </mesh>
        </Suspense>
    )
}

索引.js：

export default function App() {
    return (
        <Canvas
            style={{height:'100vh',width:'100vw'}}
            camera={{ …

我在 Heroku 上使用 Puppeteer，但收到以下错误：

Failed to launch the browser process! /usr/src/app/node_modules/puppeteer/.local-chromium/linux-756035/chrome-linux/chrome: error while loading shared libraries: libX11-xcb.so.1: cannot open shared object file: No such file or directory TROUBLESHOOTING: https://github.com/puppeteer/puppeteer/blob/master/docs/troubleshooting.md