Para crear un proyecto Vue seguiremos los siguientes pasos (omitiendo los de instalar requisitos previos si ya los tenemos):
Lo primero que necesitamos tener instalado es Node.js, que trae el gestor de paquetes npm, y lo podemos descargar aquí: https://nodejs.org/es/
Una vez instalado, tenemos que instalar Vue CLI, que nos proporciona unos comandos para la creación y prototipado de proyectos de forma simple y rápida. Para instalarlo abrimos una terminal de comandos y ejecutamos lo siguiente:
| Bloque de código |
|---|
npm install -g @vue/cli |
Una vez hecho esto, tenemos dos opciones, un script que sirve de arquetipo para aplicaciones FundewebJS, o la forma nativa.
Arquetipo FundewebJS
- En primer lugar, debemos descargar este archivo: crearProyectoFDWJS.rar. Descomprimimos la carpeta que contiene.
- Nos abrimos una terminal y nos situamos dentro de la carpeta que hemos extraído.
Ejecutamos:
Bloque de código crearProyecto.bat
- Nos pedirá que introduzcamos el nombre del proyecto, y el resto del proceso se ejecuta automáticamente.
Con esto, tendremos el proyecto creado en el mismo directorio que el script, tendremos que moverlo si queremos.
Forma nativa
Desde una terminal, nos situamos en el directorio en el que queramos generar el proyecto (nos podemos mover por los directorios con el comando cd) y ejecutamos el siguiente comando (el nombre que le demos al proyecto debe ser todo en minúsculas):
| Bloque de código |
|---|
vue create nombreproyecto |
A continuación, podremos elegir la configuración por defecto, o seleccionar los componentes y configuración manualmente. Si lo hacemos de forma manual, dispondremos de elementos como vuex o router, y se nos generarán directamente los archivos necesarios. También podremos guardar como presets las configuraciones manuales que hagamos, por si queremos reutilizarlas.
Una vez terminada la creación del proyecto, lo podremos abrir en VS Code desde File → Open Folder y seleccionando la carpeta generada.