Bienvenida al curso
Qué es Vue y bienvenida al curso
VueCli, configuración inicial del proyecto y consumo del API de Blizzard
Crea tu app con el Vue CLI
Blizzard Developer Portal
Comandos del Proyecto
Instalar librerías
Carpeta API
Obtener el token
Creación de los componentes y layouts de nuestro proyecto
Componente Loading
¡Limpiemos el proyecto!
Layouts y Vuex Modules
Assets
NavBar y Footer
Refactorizando
Home Page
Vue Router
Vista Profile
¡Más Componentes!
Listado de Héroes
Progreso (Actos)
Stats y Tiempo Jugado
Cerrando vista Profile
Hero View
Agregando funcionalidades avanzadas a nuestro proyecto
Componentes asíncronos
Objetos del Héroe
Custom Directives
Netlify
About y Error
Estos son los comandos de la aplicación que tenemos disponibles desde la terminal, cuando estamos en la carpeta del proyecto. Puedes verlos en el bloque de scripts del fichero package.json.
De momento solo estamos usando el de ejecutar el entorno de desarrollo, más adelante explicaremos el resto:
...
Regístrate o inicia sesión para leer el resto del contenido.
Aportes 12
Preguntas 3
Les va a salir otro error. Uno relacionado con el logo de Vue.
Para corregirlo deben ir a
views/Home/Index.vue
Linea 3
esto
<img alt="Vue logo" src="../assets/logo.png">
lo remplazan por
<img alt="Vue logo" src="../../assets/logo.png">
Y listo, a seguir!
Sino eliminaron el contenido del template por defecto al instalar todo, les generará un error también el logo de Vue, Lo pueden eliminar o le modifican la ruta para arreglarlo y dejar todo funcional
<img alt="Vue logo" src="../../assets/logo.png">
No se si al momento de la creación del curso aún era necesario, pero actualmente ya no es necesario especificar la extensión .vue al importar los componentes.
Aún así se me hace un poco raro el hecho de trabajar una carpeta para cada componente, al menos en el editor de código podría volverse un lío el tener abierto dos componentes que se llamen Index.vue
Les va a salir otro error y es porque no encuentra el logo de VUE ya que su dirección tambien a cambiado. este está dentro de la vista Home.
un tip para no complicarnos con las rutas es definiendolas con @ p.e “@/views/Home/Index.vue”
Agregué un nuevo comando : “dev” en los scripts que me permite por el momento correr el linting y levantar mi entorno.
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"test:unit": "vue-cli-service test:unit",
"test:e2e": "vue-cli-service test:e2e",
"lint": "vue-cli-service lint",
"dev": "npm run lint & npm run serve"
},
Si lo hacen con PhpStorm lo refactoriza solo 😄
ya no es necesario especificar la extensión .vue
Tengo dos preguntas
¿Pasa algo si uso minúsculas en el nombre de index.vue?
En la importación de los componentes en lugar de escribir la ruta completa simplemente estoy escribiendo el nombre de la carpeta y ya, por defecto resuelve en el index.vue, ¿si está bien así? Es una costumbre que traigo de otros frameworks.
Alguno sabe a qué puede deberse el siguiente error:
Uncaught ReferenceError: exports is not defined
<anonymous> vue-router.esm-bundler.js:2306
<anonymous> vue-router.esm-bundler.js:3375
js chunk-vendors.js:4913
webpack_require app.js:854
fn app.js:151
<anonymous> index.js:4
js app.js:1229
webpack_require app.js:854
fn app.js:151
<anonymous> main.js:12
js app.js:1217
webpack_require app.js:854
fn app.js:151
1 app.js:1290
webpack_require app.js:854
checkDeferredModules app.js:46
<anonymous> app.js:994
<anonymous> app.js:997
¿Existe algún problema si en lugar de mixins llego a utilizar composables con el Composition API para Vue 2?
Compañeros ayuda!!! tengo este problema y por más que he luchado no encuentro el problema:
Hice el cambio el views y el router y salió el error, probé dejar los archivos como estaban y al cambiar algo me volvió a salir, realicé un npm run lint o npm install por si eran problemas con alguna dependencia y sigue sin funcionar. Ayuda!!! Cambiando o dejando igual lo que vimos la clase pasada de la versión de babel tampoco se soluciona.
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?