Saltar al contenido

Capture todos los redireccionamientos para create-react-app en netlify

Solución:

Para capturar todos los redireccionamientos, use /* /index.html 200 en _redirects expediente.

Según los documentos de netlify, el _redirects El archivo debe estar en su directorio raíz de construcción.

create-react-app de forma predeterminada crea todos los archivos de compilación en la carpeta denominada build

así que solo modifica el build scripts en package.json para agregar el _redirects en la carpeta de compilación después de compilar la aplicación.

ejemplo.

"scripts": {
  ....
  "build": "react-scripts build && echo '/* /index.html  200' | cat >build/_redirects ",
  ...
}

Si tiene varios redireccionamientos para facilitar las cosas, puede crear un _redirects archivo con todas las redirecciones en su raíz (/) carpeta de la CRA

luego en el package.json se convertirá

"scripts": {
  ....
  "build": "react-scripts build && cp _redirects build/_redirects",
  ...
}

asegúrese de que el comando de compilación en su netlify sea yarn run build o npm run build

después de hacer los cambios en package.json simplemente reconstruya su código.

ACTUALIZADO: mucho mejor manera

EN CRA (Create React App), el script de compilación copia todos los archivos en el directorio público a la carpeta de compilación, así que simplemente coloque el _redirectos con las reglas en el directorio público sin cambiar nada y listo.

Hay dos (2) formas de crear redireccionamientos cuando se aloja en Netlify.

  • _redirects archivo en la raíz del publish directorio/build en CRA)
  • [[redirects]] lista en el netlify.toml archivo de configuración en la raíz del repositorio (proyecto)

/public/_redirects (Opción 1)

Pon el _redirects en el /public directorio. CRA copiará todos los archivos en /public al directorio de compilación cuando se ejecuta el comando de compilación.

/public/_redirects

/* /index.html  200

/netlify.toml (opcion 2)

Pon el netlify.toml en la raíz/) directorio de su proyecto (repositorio) que se está implementando en Netlify. Puede agregar las líneas de redireccionamiento al final del netlify.toml si ya existe.

/netlify.toml

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200
  force = false

Nota: Estas opciones se pueden combinar, pero recuerde _redirects sobrescribirá una entrada con la misma ruta de origen (desde) en el netlify.toml.

También puede utilizar la zona de juegos de redirecciones para convertir de un formato a otro.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *