我最近开始使用 Next.js 制作网站，并且我一直在使用各种用例的混合Image和img。
我知道这Image是内置的Next.js并且是更好的选择，但在某些情况下我不知道我加载的图像的大小或比例，因此img似乎更适合。
在我最近的项目中，这是我的npm run build命令第一次失败：
1:7 Error: Do not use <img>. Use Image from 'next/image' instead. See https://nextjs.org/docs/messages/no-img-element.
我的其他 Next.js 项目不会以这种方式失败，并且使用相同的next.config.js. 有谁知道为什么会这样？
这是由于新的 Next.js 版本将 ESLint 与其自己的一组规则集成在一起，以强制执行<Image>应始终使用的规则。您的其他项目不会失败，因为您可能没有使用 Next.js v11，或者它们可能有自己的 ESLint 配置，而您没有在其中扩展 .js 文件next。参考：nextjs.org/docs/basic-features/eslint
您可以通过以下方式在构建过程中忽略掉毛：
// next.config.js
module.exports = {
eslint: { ignoreDuringBuilds: true },
// your other settings here ...
}
如果您想专门禁用文件的规则或仅禁用一行，请执行以下操作：（如果在 VSCode 中使用 ESLint 扩展，则可以单击两次完成）
{/* eslint-disable-next-line @next/next/no-img-element */}
<img ... //>
// for whole file, add this to top:
/* eslint-disable @next/next/no-img-element */
// for a section:
/* eslint-disable @next/next/no-img-element */
// your code here...
/* eslint-enable @next/next/no-img-element */
您还可以使用.eslintrc以下方法禁用规则：
{
"extends": "next",
"rules": {
"@next/next/no-img-element": "off",
}
}
您还可以使用eslintignore或忽略（所有规则）完整文件ignorePatterns。请参考：eslint.org/docs/user-guide/configuring/ignoring-code