xHe*_*eny 22 html javascript css browser next.js
我在尝试将PNG或SVG文件添加到我的代码时遇到错误。我的错误是什么，或者我必须改变什么才能使其正常工作？
\nimport Head from \'next/head\'\nimport Image from \'next/image\'\nimport styles from \'../styles/Home.module.css\'\n\nexport default function Home() {\n return (\n <div className={styles.container}>\n\n <Head>\n <title>Maintenance</title>\n <meta name="description" content="This Website is in Maintenance Mode" />\n <link rel="icon" href="/favicon.ico" />\n </Head>\n <div className={styles.main}>\n <h1 className={styles.h1}>This website is currently in</h1>\n <break></break>\n <h1 className={styles.h2}>Maintenance Mode.</h1>\n <Image\n src="/public/logoicon/logoOrange.png"\n alt="server and database with broken cable"\n width={77}\n height={33}\n />\n <p className={styles.p}>\xc2\xa92022 Karlo-Hosting.com</p>\n </div>\n </div>\n )\n}\n我的代码在上面。
\n小智 32
解决方案1.此错误出现在终端右侧，因此“public”文件夹在根级别公开，因此您无需指定公共文件夹
试试这个 - src="/logoicon/logoOrange.png"
而不是 - src="/public/logoicon/logoOrange.png"
解决方案 2.如果控制台中出现 400 bad request 错误
那么它是一个通用的客户端错误
检查 -> a) URL 字符串语法 b) 缓存和 cookie 损坏 c) 检查图像是否太大 d) 检查命名文件夹中是否有空格
ton*_*nes 16
另外，我刚刚开始使用 Next.js，并对为什么我的图像没有显示感到困惑。多次更改格式并检查来源后。看起来图像实际上托管在公共文件夹中
我的图像问题的解决方案：
因此在以下目录中添加图像：
public/images/[place image file]
这就是我的问题所在。希望这对其他人有帮助。
尝试直接使用“/”而不是“/public”，如下所示
<Image src={`/image.png`} alt="something" height={150} width={200}/>
小智 5
如果服务器向您发送一条响应“received text/html; charset=utf-8”，请尝试分析错误。您可以看到服务器显示“这是您请求的 UTF-8 格式的文本/HTML 内容”。
检查图片来源是否正确。如果图像存在，请尝试检查文件服务器发送回给您的文本/HTML 内容。
| 归档时间： |
|
| 查看次数： |
39203 次 |
| 最近记录： |