title: Getting host is not configured error when using next/image with TypeScript
body: <p>I'm aware that when using Next.js image components without TypeScript, the URL needs to be configured in <code>next.config.js</code>, but I'm not sure why this doesn't work with TypeScript.</p>
  <blockquote>
  <p>...., is not configured under images in your <code>next.config.js</code> See more
  info: <a href="https://nextjs.org/docs/messages/next-image-unconfigured-host" rel="nofollow noreferrer">https://nextjs.org/docs/messages/next-image-unconfigured-host</a></p>
  </blockquote>
  <p>What's the workaround? or is my only option to use a regular <code>img</code> tag?</p>
  <p>image component:</p>
  <pre><code>&lt;Image
      src=&quot;https://images.unsplash.com/photo-1621794279356-0150106a4b45?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;ixlib=rb-1.2.1&quot;
      alt=&quot;blog title&quot;
      width=&quot;100&quot;
      height=&quot;100&quot;
  /&gt; 
  </code></pre>
  <p><code>next.config.ts</code></p>
  <pre><code>export const images = {
    domains: [
      &quot;images.unsplash.com&quot;
    ],
  };
  </code></pre>