No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

Curso de Webpack

Curso de Webpack

Oscar Barajas Tavares

Oscar Barajas Tavares

Deploy del proyecto con React.js

27/28
Recursos

Aportes 37

Preguntas 9

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

Si pude鈥 I did 鉂も潳

Si lo quieren desplegar en caliente solo arrastra en la parte de /sites la carpeta de dist OJO no la carpeta del proyecto si no la de distribution

Para los que tengan un error en el path de los archivos que se generan deben cambiar esto:

output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath: "/",
    },

Por esto:

output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath: "./",
    },

驴Qu茅 es lo que pasa con la carpeta dist?, 驴Por qu茅 ya no fue generada en el segundo proyecto 鈥淚ntegraci贸n b谩sica de React.js鈥 como lo hicimos en el proyecto anterior?

Para los que no quieren complicarse la vida y quieran hacer un deploy directo a github pages en un rama gh-pages. Les recomiendo instalar la dependencia gh-pages y crear un scrip para hacer deploy.

npm install --save gh-pages

De ante mano tienen que haber subido todo a un repositorio en github y hacer build.
Suponiendo que tenemos el build de nuestro proyecto en una carpeta build:

"script": "gh-pages -d build"

Agregar al package.json cual ser谩 la url del deploy en github, por ejemplo tiene esta estructura:

"homepage": "https://myusername.github.io/my-app",

Esta dependencia va a subir la carpeta build a github y va a hacer deploy autom谩ticamente, luego va a aparecer en la consola el mensaje (Published)

Les dejo la gu铆a completa, Nota: sirve para hacer deploy de lo cualquier sitio est谩tico que est茅s haciendo.
gh-pages

Todos podemos! 馃槃 si somos dedicados y perseverantes ,
Recuerden los errores son amigos.

Veo que no se genera ning煤n archivo css en /dist pero los estilos est谩n bien aplicados, alguien sabe que sera?

Muy buena la parte de react 鈥aqui el mio

Online baby! 馃憠 URL

Lo importante de esto,es tener todo anota,ya que webpack solo es configuracion mas que nada y estar pendiente de cada detalle.

Listo

App

Reto completado, migre el proyecto a react e hice el deploy en nerlify. Proyecto

Aprend铆 mucho en este curso.

(https://sparkly-pie-882534.netlify.app/)

Lo logre!!!

excelente curso

Aqu铆 mi proyecto hecho en React!!!
Portfolio

Termin茅 馃挌

Les comparto la migraci贸n a React.
app
repositorio

No me fue bien con las publicaciones en Netlify, ni con el de portfolio ni con el de react. Con el primero sal铆a un error permanente en Netlify que no se pudo corregir y con este proyecto, Netlify ni siquiera encuentra el repositorio estando correctamente creado en Github. No entend铆 porque este proyecto no tiene el archivo netlify.toml y porqu茅 hay un path haciendo referencia al dist pero no existe este directorio dentro del proyecto.

Vean el comentario de Oscar Oros.
Yo tuve problemas para desplegar la app con los elementos de Path y Alias en los webpack.config, pero como a煤n no estaban en uso los elimin茅 y funcion贸 perfecto.
No encontr茅 en la documentaci贸n ninguna, claro, porque el error est谩 en la linea anterior a Alias鈥

hola paso a dejar un comentario, si no les abre del deploy en 鈥https://netlify.com鈥, borren en 鈥渨ebpack.config.js鈥 la linea donde colocamos: publicPath 鈥/鈥, y hay si lo publica bien鈥

LO LOGREEEEEEEEEEEEEE

M谩s deploy

Gracias a la perseverancia lo pude publicar en Netlify , me daba un error porque le faltaba una s al archivo styles.
Aqui el link : https://willowy-blini-c0cd1e.netlify.app.
Aqui el repo: https://github.com/villerca/curso-webpack-react.git

it works!
link

Deploy AQUI

Lo logreee Link

馃ぉ site

Conseguido 馃憠 Click!

Si se pudo!

馃憣