Público>imágenes>img-2.jpg
src>componentes>páginas>Services.js>
import React from 'react'; import '../../App.css'; export default function Services() { return <h1 className='services'>SERVICES</h1>; }src>>Aplicación.css>
.services { background-image: url('/images/img-2.jpg'); }src>Aplicación.js>
import React from "react"; import './App.css'; import Navbar from "./components/Navbar"; import {Routes, Route} from 'react-router-dom'; import Services from './components/pages/Services'; function App(){ return( <> <Navbar /> <Routes> <Route path='/services' element={<Services />} /> </Routes> </> ) };Así es como escribí el código. Pero la imagen no funciona. Captura de pantalla (Error al compilar)
Las imágenes no se muestran, ¿cómo puedo mostrar imágenes? Por favor, ayúdame.
No debe guardar sus imágenes en la carpeta pública. Cuando use css dentro de la carpeta src, debe usar la ruta relativa al archivo de imagen y, durante la compilación, reaccionar administra y actualiza las rutas a su compilación pública.
origen: https://github.com/facebook/create-react-app/issues/1248#issuecomment-266313612
Si desea mantener su imagen pública, puede intentar usar '../../../../Public/images/img-2.jpg' como ruta, aunque se recomienda mantener sus imágenes dentro. src y deja que react los administre durante la compilación.
