nextjs中使用image图片

1. 使用nextjs的组件：

   import Image from "next/image";
   
   <Image src="xxx" alt="图片" width={300} height={300} />
   
   

2. 加入允许跨域：
   在next.config.js中加入 

   const nextConfig = {
       images: {
           domains: ["images.doc.ceo"]
       }
   }
   
   module.exports = nextConfig;

 不然会出现：Error: Invalid src prop (https://images.dog.ceo/breeds/terrier-westhighland/n02098286_617.jpg) on next/image', hostname "images.dog.ceo"is notconfigured under images in your next, config.jsSee more info: https://nextjs.org/docs/messages/next-image-unconfigured-host