Vue 3: Diferenzas entre revisións

De Wiki do Ciclo ASIR do IES de Rodeira
Saltar á navegación Saltar á procura
Sen resumo de edición
m (Xavi moveu a páxina "Vue" a "Vue 3": Titulo erróneo)
(Sen diferenzas.)

Revisión como estaba o 15 de outubro de 2024 ás 09:43

Introdución

Vue (pronunciado /vjuː/, como view) é un framework progresivo para construír interfaces de usuario. A diferenza doutros frameworks monolíticos, Vue está deseñado dende cero para ser utilizado de maneira incremental. A biblioteca central está enfocada só na capa de visualización, e é doada de utilizar e integrar con outras bibliotecas ou proxectos existentes.

Vue dispón dun "compilador" que se encarga de transformar as plantillas de Vue en código JavaScript optimizado que utilizará o navegador para renderizar o contido. Se encarga de convertir as directrices e etiquetas Vue (como v-if, v-for) en funcións JavaScript que manipulan o DOM.

As distribucións de desenvolvemento de Vue inclúen o compilador o que permite escribir as plantillas no HTML ou en ficheiros .vue sepearados sen compilalos previamente. Unha vez rematada a aplicación se "compilan" (build) xerando a aplicación de produción.

As distribucións de produción non precisan o compilador, unicamente o "runtime", xa que a aplicación xa estará "compilada" a JavaScript.

Un exemplo de plantilla Vue sería o seguinte:

import { createApp, ref } from 'vue'

createApp({
  setup() {
    return {
      count: ref(0)
    }
  }
}).mount('#app')
template
<div id="app">
  <button @click="count++">
    Count is: {{ count }}
  </button>
</div>
</script>

Instalación

Existen varias compilacións de Vue:

UMD CommonJS ES Module
Completa vue.js vue.common.js vue.esm.js
Runtime vue.runtime.js vue.runtime.common.js vue.runtime.esm.js
Completa (producción) vue.min.js - -
Runtime (producción) vue.runtime.min.js - -

A versión Completa fai referencia a distribucións que levan o motor de execución e o "compilador" de vue

Aquí tes unha táboa que mostra os diferentes ficheiros de Vue.js en varios formatos. A columna "UMD" contén os ficheiros do formato Universal Module Definition, mentres que as columnas "CommonJS" e "ES Module" amosan os ficheiros nos seus respectivos formatos. Para a versión de producción, só están dispoñibles algúns dos ficheiros.

Existen varios modos de instalación:

  • Inclusión Direta con <script>: Simplemente se debe descargar e incluír a etiqueta script coa ruta correcta, ou utilizar un CDN. Vue será rexistrado como unha variable global. Por exemplo: <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>. Vue tamén está dispoñible nos CDN unpkg e cdnjs. A versión de produción completa é vue.min.js.