htmlcinco

HTML 5, encontrá novedades, tutoriales y traducciones sobre este lenguaje.

Cómo crear un proyecto VueJS en 3 minutos

Cómo crear un proyecto VueJS en 3 minutos

Estoy usando VueJS en todos mis nuevos proyectos, es muy fácil, no tiene complicaciones. Aquí te dejo los pasos para comenzar un proyecto de forma muy rápida, en 3 minutos (o menos).

Instalar vue-cli globalmente

vue-cli es la herramienta que te permite iniciar proyectos vueJS desde la terminal. Ten en cuenta que la necesitas instalar solo 1 vez, luego la puedes usar para todos tus otros proyectos.

npm install -g vue-cli

Crear el proyecto Vue

Ahora puedes crear proyectos Vue con solo una línea de comando en la terminal. La sintaxis de este comando es la siguiente:

vue init

El template al que refiere es a como creará tu proyecto, existen varios de estos ‘plugins’ (webpack, typescript, pwa, etc) los puedes ver aquí. En este caso vamos a usar el más simple: webpack-simple

vue init webpack-simple mi-proyecto

Iniciar nuestro proyecto

Cuando el proyecto ya esté creado lo que tienes que hacer es simplemente lo que te indica en la pantalla:

cd mi-proyecto
npm install
npm run dev

El último comando iniciará un servidor http y abrirá el navegador en la url donde tu nuevo sitio esté corriendo (ej: http://localhost:8080).

¡Ya está! El tiempo total de ejecución de todo es rapidísima y ya tendrás un proyecto VueJS andando listo para comenzar a trabajar en él.

Comparte conocimiento:
Tweet about this on Twitter
Twitter
Share on LinkedIn
Linkedin
Share on Facebook
Facebook
0
¿Quieres saber más?
¡Suscríbete a nuestro newsletter!

Respetamos tu privacidad y tu tiempo, no recibirás ningún tipo de correo basura.

4 comentarios para “Cómo crear un proyecto VueJS en 3 minutos”

  1. ale dice:

    Hola, como inicias un proyecto existente?
    Quiero decir, empece con un tutorial y no se que comandos necesito para abrirlo en la consola? Lo q habia hecho ya no me sale en pantalla.
    Gracias!

  2. admin dice:

    Hola Ale, creo que no entiendo tu pregunta pero el proyecto lo corres con npm run dev
    Saludos

  3. Marcell dice:

    Excelente aporte… saludos desde Venezuela

  4. admin dice:

    Muchas gracias!

Dejar un comentario

¿Quieres saber más?

 

¡La mejor información en tu correo!

(proximamente importantes novedades)