Si la primera mejor amiga del programador es la línea de comandos, es momento de instalar y configurar el segundo mejor amigo del programador: el editor de código.
Existen multiples editores de código, para la escuela de JavaScript vamos a utilizar Visual Studio Code. Vamos a añadir diferentes plugins para VSCode:
Git Blame: va a mostrar el autor de la línea de código en la que estemos trabajando.
ESLint: es una herramienta de análisis de código estático para identificar patrones problemáticos encontrados en el código JavaScript, o sea, nuestro linter. Debemos instalar y configurar eslint para que siga el estilo de código que le indiquemos.
Color Highlight: resalta el color que estemos escribiendo.
La ruta del curso no está clara. Visual Studio fue instalado y el entorno confirgurado en el clase 2. Creo que estas redudancias pueden generar errores. Por eso hay tanta genet con problemas para instalar lo que el profesor solicita. Debió haber clases especiales para windows y para mac, pues está claro que hay diferencias. Por ejemplo para instal my zsh en windows Ubuntu no permite algo tan simple como pegar. Sin embargo el profesor lo puede hacer en su Mac.
En definitiva el curso parece algo errático y los comentarios lo están demostrando. Ojalá lo mejoren en el futuro para que no nos hagan perder tanto tiempo.
Totalmente de acuerdo contigo. Para ser el pre-work, me es complicado pensar que con lo mal organizado que está alguien que se encuentre con tantos problemas considere continuar. Es normal que aprender algo nuevo duela, sin embargo, no está justificado que Platzi haga que te duela aún más.
X3
A los que lñe sale ese tipo de error solo escriban el comando:
sudo npm install -g eslint
y luego les pedira su contraseña, y listo
gracias por la ayuda
Gracias maestro
PARA LOS USUARIOS DE WINDOWS
Se me desconfiguró todo en esta clase... y lo arreglé :')..
cualquier comando npm no era válido, me aparecía lo siguiente:
: not foundram Files/nodejs//npm: 3:
: not foundram Files/nodejs//npm: 5:
/mnt/c/Program Files/nodejs//npm: 6: Syntax error: word unexpected (expecting "in")
PARA SOLUCIONARLO ES NECESARIO INSTALAR NODE Y NPM OTRA VEZ PERO UNO TRAS OTRO..
Este comando nos permite usar sudo en la linea de comandos linux instalada.. casi lloro cuando lo logré :')
Paso2
Ejecutar:
sudo apt-get --purge remove node
Este comando elimina nodejs en modo desquisiado!!! (Si no les funciona escriban lo mismo pero con js "sudo apt-get --purge remove nodejs" porque windows es tonto y no sabe asociar ;D)
Paso 3
Ejecutar:
sudo apt-get install -y nodejs
Esto les instalará node y con la flag -y se pueden ir a tomar un tecito, porque se demora :cc
Paso 4
Ejecutar:
sudo apt-get install -y build-essential
Este comando es el que nos permitirá instalar dependencias de node y otros sin problemas :') tbn casi lloro con este.. es hermoso!
Paso 5
Ejecutar:
sudo apt-get install npm
Instalamos npm, y vamos por unos snaks porque los boleros son más rápidos :ccc
ESTE COMANDO ES IMPORTANTÍSIMO, nos permite ejecutar como corresponde nuestro npm, el que tiene mal direccionado windows.. por eso no podemos ejecutar el pinche npm..
Finalmente
Podemos ejecutar
node -v
npm -v
Y la vida es maravillosa...
Consejo: Si los aportes de nuestros apartados no les funciona, busquemos en internet, a veces somos cómodos y si en los comentarios no está la respuesta nos quedamos ahí... y si encuentran la respuesta, compártanla :c todos estamos con ganas de aprender, pero BUSQUEMOS, internet tiene tooodo no nos quedemos sin hacer naaara :ccc #yonosoyelosoperez ^^ Saludos.
Ejecuto el comando del paso 6 pero no me deja. Hay algún espacio en el comando? export PATH=/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin
Viejo no sabes cuanto tiempo estuve dando vueltas buscando la solución a este problema: El terminal de VSCode no reconocía el npm y ya había confirmado que todo estaba bien desde Hyper. Lo único que necesitaba era ejecutar el paso 6 que muestras aquí !! Como bien dices es importantísimo ejecutarlo, pues sino npm es como si no existiera. Mil gracias!
Es muy frustrarte que lo que hace el instructor no funciona en todas las plataformas, la configuración que el hace en IOs marca montones de errores en Windows subsistem linux y es mucho tiempo perdido tratando de setear el entorno de trabajo igual que el instructor sin tener un camino claro. El taller debería estar orientado multiplataforma y ser lo mas claro posible. Y sobre todo contestar los comentarios de los alumnos todos están batallando montones y solo entre alumnos se apoyan. Tache para teamPlatzi
PD. gracias a la comunidad enserio son de gran ayuda.
pues un año después parece que ésto sigue igual.... menudo inicio de escuela... creo que no hubiera costado nada hacer diferentes videos para diferentes plataformas. montón de tiempo perdido y sigo sin solución...
¿Que es EsLint?
ESLint es una herramienta de análisis de código estático para identificar patrones problemáticos encontrados en el código JavaScript.
Instalación de EsLint
sudo npm install -g eslint
o
sudo npm i -g eslint
(das permisos de administrador)
Configuración de Eslint
npx eslint --init
❯ To check syntax and find problems
❯ JavaScript modules (import/export)
❯ React
? Does your project use TypeScript? (y/N) N
? Where does your code run? Browser
❯ Use a popular style guide
? Which style guide do you want to follow? Airbnb: https://github.com/airbnb/javascript
? What format do you want your config file to be in? JavaScript
? Would you like to install them now with npm? (Y/n) Y
Muchas gracias! Es justo lo que necesitaba. Saludos!
Muuuchisimas gracias!! Una vez mas la comunidad salvando las papas. Un saludo
Para los que usamos windows en mi caso al principio me marcaba muchos errores pero luego de leer varios comentarios de aportes logre instalar todo bien y los pasos fueron los sguientes.
como no tenia el el proyecto de ejemplo de git que colocan en el video utilice el que se hizo al principio del curso
-abri ubuntu como administrador
-cd /mnt/c (para estar en el disco C)
luego que estoy en el disco C voy a la carpeta Users (cd Users)
-ya que estoy dentro de Users me voy a la carpeta que cree en el inicio en mi caso luisDev, luego me fue a la carpeta portafolio que es donde esta el proyecto de node.
-estando en esa carpeta inicio Vs Code con Code . (punto)
-ya con el proyecto abierto verifico el bash y lo cambio por el ZSH
-reinicio el vs code y lo inicio nuevamente desde ubuntu
-inicio la terminal y coloco el comando:
*sudo npm install -g eslint
-luego de que se instala coloco el comando:
*sudo npx eslint --init
-seguimos el video todo normal hasta la parte de :
*Would you like to install them now with npm? Yes
se instala todo normal pero mandaba el siguiente error:
npm WARN tsutils@3.17.1 requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself.
-luego de leer he investigar tenia que instalar typescript
-se instala con el siguiente comando en la terminal de vs code:
*sudo npm install typescript
-luego que se instala volvemos a usa el comando:
*sudo npx eslint --init
-y hacemos el resto del video normalmente.
gracias hermano tu aporte si me ayudo bastante
Uy anotese un 10!!
Gracias.... la pregunta es porque toca lanzar VScode desde ubuntu y no se puede normal? lo intente un montón de veces incluso con sudo todo.
Gracias!
Tuve varios errores
El primero fue que no encontraba " Terminal" en help
++Solucion esta aparte, al lado de help:++ Funciono OK
El segundo que no encontraba zsh en la terminal de VS
++Solucion; En mi terminal ZSH = WSL++ : Funciono OK
El tercero : No podia instalar npm me salia error EACCES
++Solucion: agregue sudo al inicio ++: Funciono Ok
El Cuarto: No me aparecia nada en el comando npx
++Solucion: cargue de nuevo el codigo sin npx++: Funciono Ok
Héroe.
Estaba apunto de renunciar a mi carrera de desarrollador hasta que vi lo que publicaste de que ZSH = WSL. Te amo, estaré eternamente agradecido.
Para los que tiene problemas con EsLint
Deben iniciar Visual como administrador.
Deben de estar en la carpeta que estamos trabajando (Portfolio)
Colocan el siguiente comando en la terminal (sudo npm install -g eslint)
Luego el comando (npx eslint --init), siguen los pasos en el video.
Listo
muchas gracias se soluciono mi problema
Muchas gracias compañero me ayudó con el problema que tenía, aquí es donde nos damos cuenta que windows es muy celoso con todo lo que se instala que tenemos que reiniciar programas, ejecutarlos como administrador y hasta reiniciar el equipo.
Si como a mi, al ejecutar :
npx eslint --init
Te arrojo estos errores:
Es porque los archivos de la clase son (por asi decirlo) del final de la clase, no del principio, es decir que desde que descargues los archivos ya se incluyen los archivos:
.eslintrc.json
package.json
package-lock.json
El problema con esto es que a pesar de ya estar ahí no nos corregirá la sintaxis ni nada, esto se soluciona ELIMINANDO estos archivos, y ejecutando el siguiente comando:
npm init
Ahora ya podemos ejecutar npx eslint --init y nuestro proyecto se configurara correctamente.
Excelente amigo, muchas gracias
Hay que tener claro que el archivo package.json no hay que borrarlo lo que hay que hacer es eliminar la dependencia de ESlint que se encuentra al final del documento, porque ESlint necesita tener este archivo creado con anterioridad para su funcionamiento.
Es un desmadre esto, hacen dos videos con distintos profesores para instalar las cosas y se crea mucha desinformación, para ser una plataforma de paga deberían tener mas seriedad.
NO DEBES OBVIAR PASOS, NO TODOS TENEMOS UN MAC EN CASA.
Una sugerencia para el profesor,
Veo pertinente realizar otra clase configurando VSCode en Windows, debido a que, leyendo todos los aportes, me di cuenta que la mayoría de los usuarios de Windows tenemos problemas, llevo todo el día buscando soluciones para que me funcione la terminal y creo que si estoy viendo una clase es para que el profesor explique como se tiene que hacer, ya que desconozco mucho del tema y hago lo que puedo.
No me malinterpreten, excelente explicación, pero solo si tienes una Mac. Si eres usuario de Windows arréglatelas por tu cuenta.
Hay una oportunidad de mejora muy grande para los que usamos Windows que deberían tener en consideración.
A quienes les salte en la parte de "npx eslint --init" que les hace falta un "package.json" hagan ésto (recuerden correr el editor con permisos de administrador):
En la línea de comandos, ir al directorio de su proyecto (o a donde quieran instalar eslint)
cd/mnt/c/Users/Ram/Documents/ProyectoX
Cuando estén en en el directorio, escriban lo siguiente
npm init --yes
Eso creará un package.json con los atributos necesarios, ya que si lo hacemos con un comando "touch" sólo creará un archivo vacío y saltarán más errores (experiencia propia).
Vuelvan a escribir npx eslint --init y todo funcionará correctamente.
Estaré atento a sus preguntas.
Gracias!
Muchas muchas gracias amigo! No sabes cuanto me sirvió
Aquí comparto la configuración que se siguió para completar exitosamente el procedimiento:
NOTA:
Después de ejecutar los pasos anteriores, continuar desde el paso 1: sudo npm install -g eslint
Muchas gracias !! casi no puedo avanzar de ese error...
muchas gracias, tenia media hora atorado y me funciono perfecto
Posibles problemas y sus soluciones:
zsh no aparece en la terminal de VSC: en visual studio code no nos aparecerá zsh, si no que wsl(si estamos en Windows).
Si al ejecutar npm install -g eslint, te tira errores, deberás de ejecutarlo anteponiendo la palabra sudo.
Si al ejecutar npx eslint --init te muestra error, prueba ejecutarlo sin npx, sólo eslint --init.
Gracias Crack!
De nada bro! :)
Por si les salen un error con la instalación del eslint minuto 4:43, es posible que sea
porque necesitan derechos de administración. Usen este código con sudo:
sudo npm install -g eslint
Ponen la contraseña y listo.
Por cierto, recuerden entrar por la consola de ubuntu como en la clase 2 para que les aparezca la extension zsh
en la terminal :)
Amigos vengo del futuro!!
Los que tengan problemas con windows vayan a la clase 10 "Como instalar NodeJS" para solucionarlos.
Bueno, mi problema en particular fue desde:
npm install -g eslint
La solucion no fue tan simple, con la consola zsh corriendo en VS intenten ejecutar los comando con (sudo su).
Luego, la version de nodejs debe ser minimo 12.x, la version que automáticamente descargar ubuntu es 8.x y por alguna razón no reconoce los comandos npm y npx (en mi caso particular).
Por tanto, el comando que me permitió actualizar nodejs a la version 12.x es la siguiente:
Despues de descargar nodejs v12.x debes instalarlo:
sudo apt-get install -y nodejs
Luego de verificar que ya tienes nodejs v12.x , puedes seguir con los comandos del profesor de instalar eslint globalmente. (en mi caso con sudo por delante).
sudo npm install -g eslint
Y listo, ya ejecuta los comandos npm y npx tambien.
Gracias me funciono.
a mi no me pregunta el estilo, sabes por que?
para los que tengan el siguiente error o uno parecido
ejemplo del error:
npm ERR!Cannot read property 'match'ofundefinednpm ERR!A complete log ofthis run can be found in:npm ERR!C:\Users\tivac\AppData\Roaming\npm-cache\_logs\2018-06-06T16_16_57_256Z-debug.log
la solución es la siguiente
borrar el archivo de nombre package-lock.json y volver a ejecutar el comando
npx eslint --init
y con esto esta solucionado, pido disculpas si alguien tiene este error y no le respondo en su mismo comentario o pregunta es que hay demasiados comentarios si pueden respondan las preguntas que tengan este error como interrogante, gracias.
gracias por tu comentario, ya estaba deseperado
¿Buenas tardes por qué no responden las inquietudes de los estudiantes?. Sin esas respuestas no podemos seguir el curso.
No aparece ZSH
2 El comando npm install -g eslint no esta funcionando a algunos les sale error
el comando npx eslint --init, a algunos nos sale zsh: command not found: npx igual pasa cuando se utiliza "sudo".
Por favor necesitamos respuestas de los profesores, pues parece que ustedes solo cuelgan videos y realmente no dan una clase o retroalimentan a los estudiantes y son problemas que vienen desde hace rato.
Muchas gracias
Estoy trabajando con Windows. Para hacer los cambios que se solicitan en VS en la terminal seleccione wsl actualice e instale eslint con el siguiente comando :npm install -g eslint. Inicialmente presentó un error pero automaticamente se corrigió, de momento todo va bien.
