Compartir a través de

Instalación de Vue.js en el Subsistema de Windows para Linux

  • Artículo

Una guía que le ayudará a configurar un entorno de desarrollo Vue.js en Windows mediante la instalación del marco web Vue.js en Subsistema de Windows para Linux (WSL). Para más información, vaya a la página Introducción a Vue.js.

Vue se puede instalar directamente en Windows o en WSL. Por lo general, se recomienda instalarlo en WSL si se planea interactuar con un back-end de NodeJS, se desea tener paridad con un servidor de producción Linux o se tiene previsto seguir un tutorial que use comandos de Bash. También puede considerar Vite como una alternativa a Vue.js.

Requisitos previos

  • Instale el Subsistema de Windows para Linux (WSL), incluida una distribución de Linux (como Ubuntu), y asegúrese de que se ejecuta en modo WSL 2. Para comprobarlo, abre PowerShell y escribe: wsl -l -v.
  • Instale Node.js en WSL 2: aquí se incluye un administrador de versiones, un administrador de paquetes, Visual Studio Code y la extensión de Remote Development. El Administrador de paquetes de Node (npm) se usa para instalar Vue.js.

Importante

La instalación de una distribución de Linux con WSL creará un directorio para almacenar archivos: \\wsl\Ubuntu-20.04 (sustituya Ubuntu-20.04 por la distribución de Linux que vaya a usar). Para abrir este directorio en el Explorador de archivos de Windows, abra la línea de comandos de WSL, seleccione el directorio principal con cd ~ y, a continuación, escriba el comando explorer.exe .. Tenga cuidado de no instalar ni almacenar archivos con los que vaya a trabajar en la unidad C montada (/mnt/c/Users/yourname$). Si lo hace, aumentarán considerablemente los tiempos de instalación y compilación.

Instalación de Vue.js

Para instalar Vue.js en WSL:

  1. Abra una línea de comandos de WSL (por ejemplo, Ubuntu).

  2. Crea la nueva carpeta de proyecto mkdir VueProjects y accede al directorio cd VueProjects.

  3. Instale Vue.js mediante el Administrador de paquetes de Node (npm):

npm install vue

Compruebe el número de versión que ha instalado, para lo que debe usar el comando: vue --version.

Nota

Para instalar Vue.js mediante una red CDN, en lugar de NPM, consulte los documentos de instalación de Vue.js.

Instalación de la CLI de Vue

La CLI de Vue es un kit de herramientas para trabajar con Vue en su terminal o línea de comandos. Permite aplicar la técnica scaffolding a un nuevo proyecto (vue create), crear prototipos de nuevas ideas (vue serve) o administrar proyectos mediante una interfaz gráfica de usuario (vue ui). La CLI de Vue es un paquete de npm instalado globalmente que controla automáticamente algunas de las complejidades de la compilación (como el uso de Babel o Webpack). Si no va a compilar una nueva aplicación de una sola página, es posible que no necesite ni desee la CLI de Vue.

Para instalar la CLI de Vue, use npm. Debe usar la marca -g para instalarlo globalmente con el fin de actualizarlo (vue upgrade --next):

npm install -g @vue/cli

Para más información sobre los complementos adicionales que se pueden agregar (como linting o Apollo para integrar GraphQL), visite la sección sobre complementos de la CLI de Vue en la documentación de la CLI de Vue.

Recursos adicionales