• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

255
Vistas
Configuración de miniaturas de Codesandbox

Tengo algunos códigos y cajas que muestran la miniatura de la caja de arena predeterminada y otros que muestran la miniatura de la derecha de los códigos y la caja.

Ver la captura de pantalla de mi lista de sandboxes ingrese la descripción de la imagen aquí

No me queda claro de qué depende

He mirado ladocumentación para entender si tengo que configurar el sandbox.config.json pero no he encontrado nada útil

¿Cómo puedo configurar la miniatura de mis codesandboxes?

over 3 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

No hay una forma integrada de crear una miniatura personalizada, pero encontré una solución.

Es posible cambiar (actualizar) la miniatura visitando https://codesandbox.io/api/v1/sandboxes/SANDBOX_ID/screenshot.png , donde SANDBOX_ID es el ID de su sandbox de código (puede encontrarlo visitando el sandbox que desea personalizar, luego obtenga la última parte del enlace, por ejemplo, https://codesandbox.io/s/`h8pG8` ); codesandbox visitará su página de sandbox y tomará una nueva captura de pantalla de su aplicación y actualizará su sandbox.

Aquí está la parte hacky:
Simplemente cargue la imagen que desee como miniatura en su caja de arena, luego, en su página de inicio, ¡muestre temporalmente esa imagen! Podrías hacer algo como:

 <img src="/path/to/my/thumbnail" style="position: fixed; top: 0; left: 0; height: 100%; width: 100%; object-fit: cover; z-index: 100;" />

Luego visite el punto final ( https://codesandbox.io/api/v1/sandboxes/SANDBOX_ID/screenshot.png ); revisa tu tablero para ver si la miniatura cambió.

(¡asegúrate de eliminar la imagen más tarde!)

over 3 years ago · Santiago Trujillo Denunciar

0

Hola: Soy el que creó el problema de GitHub codesandbox/codesandbox-client#2170 que descubriste y mencionaste , que aborda este tema exacto.

El "microservicio de captura de pantalla" mencionado en el hilo por los empleados de CodeSandbox parece que ya no funciona (o al menos no en este momento). Si funcionó, podría usar una URL en este formato para actualizar la captura de pantalla de uno de sus entornos limitados:

 https://codesandbox.io/api/v1/sandboxes/sandboxId/screenshot.png

De acuerdo con su comentario aquí , esta es la URL que usaría para actualizar el entorno limitado específico que mencionó:

https://codesandbox.io/api/v1/sandboxes/oxdod/screenshot.png

Debido a que ese método sugerido oficialmente no está funcionando, su ruta más directa para obtener una respuesta es ponerse en contacto con el servicio de atención al cliente utilizando una de las opciones en la parte inferior de la página de Preguntas frecuentes de CodeSandbox. Sugiero enviar un correo electrónico Y abrir un nuevo problema público en el repositorio.

over 3 years ago · Santiago Trujillo Denunciar

0

Este es un error existente para codesandbox, sin embargo, he encontrado una solución temporal para que no se muestre la vista previa. Tome una captura de pantalla de su código/proyecto, cámbiele el nombre thumbnail.png y cárguelo en los archivos

ingrese la descripción de la imagen aquí

over 3 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda