vue cli

Usar librería de NPM en Vue con webpack y require

En este post de programación con JavaScript y Vue te enseñaré a importar una librería de NPM a un componente de Vue. Si bien esto es algo muy simple, en ocasiones podemos olvidarnos o perdernos.

Por ello es que en el post de hoy te enseñaré a importar un paquete de NPM desde un componente de Vue y usarlo dentro de ese componente a través de require.

Estoy suponiendo que usas la Vue CLI con Webpack, pero incluso si no lo haces, esto podría darte una ayuda.

(más…)

Por parzibyte, hace

Configurar publicPath de Vue CLI en ./

En este tutorial te mostraré cómo hacer que la ruta pública de Vue (al usar la vue cli para compilar nuestros proyectos con npm run build) sea el directorio actual, es decir, ./.

Normalmente la Vue CLI va a compilar y crear el archivo index.html pero en las rutas habrá algo como:

script src=/js/script.js

Si te fijas, no tiene el ./, por lo que en varios servidores causará errores. Hoy te enseñaré cómo hacer que Vue CLI compile las rutas de manera relativa al directorio actual.

(más…)

Por parzibyte, hace
Archivos env para Vue js y Vue CLI

Variables del entorno con Vue.js y Vue CLI

Las variables del entorno en Vue.js sirven para saber el entorno en el que estamos (producción o desarrollo) y también para acceder a otros datos que cambian dependiendo del entorno.

Por ejemplo, en producción podemos tener una clave API o una URL de la API, mientras que en desarrollo esas variables pueden cambiar.

Es por ello que las variables del entorno o environment variables de la Vue CLI vienen para ayudarnos, ya que nos permiten definir variables propias y también a conocer el entorno en el que estamos.

(más…)

Por parzibyte, hace

Primeros pasos con VueRouter: el enrutador de Vue

Una vez que ya hemos creado un proyecto con la CLI de Vue (usando Buefy, por ejemplo) podemos agregarle otros paquetes como un enrutador.

Vue Router es el enrutador oficial para Vue.Js y permite crear Aplicaciones de una sola página o Single Page Applications.

De esta manera tenemos una navegación más fluida sin recargar la página, ahorrando ancho de banda y agregando velocidad.

En este post vamos a ver cómo instalar y configurar el enrutador de Vue usando NPM, además de configurar las rutas para que coincidan con nuestros componentes.

(más…)

Por parzibyte, hace