Bird
0
0

You wrote this Remix code but the image does not appear:

medium📝 Debug Q14 of 15
Remix - Performance
You wrote this Remix code but the image does not appear:
import { Image } from '@remix-run/react';

export default function Logo() {
  return <Image source='/logo.svg' alt='Logo' />;
}

What is the error and how to fix it?
AThe alt attribute is missing; add alt text for accessibility.
BThe import statement is wrong; use default import instead.
CThe prop 'source' is incorrect; change it to 'src'.
DThe Image component must be wrapped in a div to render.
Step-by-Step Solution
Solution:
  1. Step 1: Identify incorrect prop name

    The Image component expects src, not source.
  2. Step 2: Correct the prop to fix image loading

    Change source='/logo.svg' to src='/logo.svg' to display the image.
  3. Final Answer:

    The prop 'source' is incorrect; change it to 'src'. -> Option C
  4. Quick Check:

    Use 'src' prop for image source [OK]
Quick Trick: Use 'src' prop, not 'source', for images [OK]
Common Mistakes:
MISTAKES
  • Using 'source' instead of 'src'
  • Thinking import syntax is wrong
  • Missing alt attribute (not causing no image)

Want More Practice?

15+ quiz questions · All difficulty levels · Free

Free Signup - Practice All Questions
More Remix Quizzes