未验证 提交 6bc6e2c4 编写于 作者: Y Yamagishi Kazutoshi 提交者: GitHub

Improve types for Image Component (#17954)

![Screenshot on VS Code](https://user-images.githubusercontent.com/12539/96300300-43fc1280-1030-11eb-89ae-dba8beeca583.png)

The only attribute that must be used with Image Component is src, but all attributes are required and TypeScript will warn you.
上级 6f13956f
...@@ -16,14 +16,12 @@ type ImageData = { ...@@ -16,14 +16,12 @@ type ImageData = {
breakpoints?: number[] breakpoints?: number[]
} }
type ImageProps = { type ImageProps = Omit<JSX.IntrinsicElements['img'], 'src' | 'sizes'> & {
src: string src: string
host: string host?: string
sizes: string sizes?: string
breakpoints: number[] priority?: boolean
priority: boolean unoptimized?: boolean
unoptimized: boolean
rest: any[]
} }
let imageData: any = process.env.__NEXT_IMAGE_OPTS let imageData: any = process.env.__NEXT_IMAGE_OPTS
...@@ -73,15 +71,15 @@ type PreloadData = { ...@@ -73,15 +71,15 @@ type PreloadData = {
src: string src: string
host: string host: string
widths: number[] widths: number[]
sizes: string sizes?: string
unoptimized: boolean unoptimized?: boolean
} }
function generatePreload({ function generatePreload({
src, src,
host, host,
widths, widths,
unoptimized, unoptimized = false,
sizes, sizes,
}: PreloadData): ReactElement { }: PreloadData): ReactElement {
// This function generates an image preload that makes use of the "imagesrcset" and "imagesizes" // This function generates an image preload that makes use of the "imagesrcset" and "imagesizes"
...@@ -106,8 +104,8 @@ export default function Image({ ...@@ -106,8 +104,8 @@ export default function Image({
src, src,
host, host,
sizes, sizes,
unoptimized, unoptimized = false,
priority, priority = false,
...rest ...rest
}: ImageProps) { }: ImageProps) {
// Sanity Checks: // Sanity Checks:
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册