Which of the following is the correct way to import and use the Remix Image component in your React component?

easy📝 Syntax Q12 of 15

Remix - Performance

Which of the following is the correct way to import and use the Remix Image component in your React component?

Aimport { Img } from '@remix-run/react';<br><Img src='/photo.jpg' alt='Photo' />

Bimport { Image } from '@remix-run/react';<br><Image src='/photo.jpg' alt='Photo' />

Cimport Image from 'remix-image';<br><Image source='/photo.jpg' altText='Photo' />

Dimport Image from '@remix-run/image';<br><Image src='/photo.jpg' />

Step-by-Step Solution

Solution:

Step 1: Check the official Remix import syntax
The Remix Image component is imported from '@remix-run/react' using named import.
Step 2: Verify correct usage of props
The component uses src and alt props, not source or altText.
Final Answer:
import { Image } from '@remix-run/react'; <Image src='/photo.jpg' alt='Photo' /> -> Option B
Quick Check:
Correct import and props = import { Image } from '@remix-run/react';
[OK]

Quick Trick: Use named import from '@remix-run/react' with src and alt [OK]

Common Mistakes:

MISTAKES

Master "Performance" in Remix

9 interactive learning modes - each teaches the same concept differently

Want More Practice?

15+ quiz questions · All difficulty levels · Free

More Remix Quizzes