title: Load GLTF model in next.js / Error: Could not load <url> response.body.getReader is not a function
body: <p>How to load a model GLTF model in next.js?</p>
  <p>I spend hours looking for this. Nothing works :(</p>
  <hr />
  <p>What I tried so far:</p>
  <ul>
  <li>use different loaders ( <code>useLoader(GLTFLoader,url) / useGLTF(url)  and some more</code></li>
  <li>wrap the component in a <code>next/dynamic</code> component / dont do it</li>
  <li>solve the errors related to <code>suspense</code> not beeing support by installing next with react 18</li>
  <li>tried <a href="https://github.com/pmndrs/react-three-next" rel="nofollow noreferrer">this starter template</a></li>
  <li>use <code>three-stdlib</code></li>
  <li>tried to write a custom loader in <code>next.config.js</code></li>
  </ul>
  <p>read every issue and forum post i could find on tis issue</p>
  <hr />
  <p>The error i get at the moment is:</p>
  <pre><code>Server Error
  Error: Could not load  &lt;url&gt; response.body.getReader is not a function
  </code></pre>
  <p>with a component looking like this:</p>
  <pre><code>import React from 'react'
  import { useGLTF } from '@react-three/drei'
  import { Canvas, } from '@react-three/fiber'
  import { Suspense } from 'react/cjs/react.production.min';
  
  export default function Spinner({ ...props }) {
    const model = useGLTF(&quot;http://localhost:3000/spinner.glb&quot;)
    return (
      &lt;Suspense fallback={&quot;loading&quot;}&gt;
        &lt;Canvas
          camera={{ position: [1, 1, 1] }}
        &gt;
          &lt;primitive object={model.scene} /&gt;
          &lt;color attach=&quot;background&quot; args={[&quot;hotpink&quot;]} /&gt;
        &lt;/Canvas&gt;
      &lt;/Suspense&gt;
    )
  }
  </code></pre>
  <hr />
  <p>package.json:</p>
  <pre><code>  },
    &quot;dependencies&quot;: {
      &quot;@react-three/drei&quot;: &quot;^7.27.3&quot;,
      &quot;@react-three/fiber&quot;: &quot;^7.0.21&quot;,
      &quot;axios&quot;: &quot;^0.24.0&quot;,
      &quot;next&quot;: &quot;^12.0.7&quot;,
      &quot;react&quot;: &quot;^18.0.0-beta-24dd07bd2-20211208&quot;,
      &quot;react-dom&quot;: &quot;^18.0.0-beta-24dd07bd2-20211208&quot;,
      &quot;three&quot;: &quot;^0.135.0&quot;,
      &quot;three-stdlib&quot;: &quot;^2.6.1&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;eslint&quot;: &quot;8.4.1&quot;,
      &quot;eslint-config-next&quot;: &quot;12.0.7&quot;,
      &quot;file-loader&quot;: &quot;^6.2.0&quot;
    }
  }
  </code></pre>
  <p>node-version:</p>
  <pre><code>16 LTS
  </code></pre>