Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

239
Visualizações
NextJS error al importar componente con imagen local de otro paquete

Tengo un monorepo que tiene un proyecto NextJS y una biblioteca React. Quiero importar componentes del proyecto de reacción al proyecto nextjs. Hasta ahora todo bien... pero cuando trato de importar un componente que tiene una imagen local, aparece el siguiente error:

PublicPath automático no es compatible con este navegador

Entiendo que tengo que poner la ruta de los activos en el archivo de configuración del paquete web, pero incluso haciendo eso, NextJS no puede resolver las imágenes. ¿Qué me estoy perdiendo?

He replicado el error en un repositorio público para que puedas ver lo que sucede.

Biblioteca de componentes:

 import React from "react"; const TestComponent = () => ( <div> <p>Test Component</p> <img src={require("./arrow-down.png").default} width="10px" height="10px" /> </div> ); export default TestComponent;

NextJS importando el componente:

 import TestComponent from "react-project"; export default function Home() { return ( <div> <TestComponent /> </div> ); }

El proyecto tiene la siguiente estructura -- paquetes -- nextjs-project -- react-project -- package.json

depósito público.

Solo necesita instalar las dependencias con yarn (o npm si lo desea) y compilar la biblioteca de reacción con webpack (construcción de hilo).

Sé que me falta algo de teoría sobre las imágenes en NextJS. ¡Gracias!

about 4 years ago · Santiago Trujillo
1 Respostas
Responde à pergunta

0

primero deberá instalar este paquete en devDependencies:

 npm i -D file-loader yarn add -D file-loader

entonces deberá agregar lo siguiente a las "reglas" dentro de webpack.config:

 { test: /\.(png|jpe?g|gif)$/i, use: [ { loader: 'file-loader', }, ], },
  • Y finalmente, deberá cambiar el requisito con una importación. tal vez se pueda extraer con un método requerido, pero no estoy lo suficientemente familiarizado con él.
about 4 years ago · Santiago Trujillo Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda