Diferencia entre revisiones de «Usuario:ManuelRomero/Laravel/vue»

De WikiEducator
Saltar a: navegación, buscar
(Página creada con «{{:Usuario:ManuelRomero/micursos/Laravel/vue/nav}}»)
 
Línea 1: Línea 1:
 
{{:Usuario:ManuelRomero/micursos/Laravel/vue/nav}}
 
{{:Usuario:ManuelRomero/micursos/Laravel/vue/nav}}
 +
 +
{{MRM_Actividad|Title=Instalación|
 +
;Instalamos el paquete '''''laravel/ui''''' o lo incluimos en nuestro compoer.json y actualizamos con composer
 +
<source lang=bash>
 +
composer require laravel/ui
 +
</source>
 +
;Con artisan, instalamos vue en nuestro poryecto
 +
<source lang=bash>
 +
php artisan ui vue
 +
npm install
 +
npm run dev
 +
</source>
 +
*Tras la instalación nos debe de enseñar que ha creado los ficheros correspondientes
 +
[[Archivo:instalacion_vue_laravel1.png]]
 +
*Y verificamos el contendio del fichero  '''''resources/js/app.js'''''
 +
<source lang=php>
 +
/**
 +
* First we will load all of this project's JavaScript dependencies which
 +
* includes Vue and other libraries. It is a great starting point when
 +
* building robust, powerful web applications using Vue and Laravel.
 +
*/
 +
 +
require('./bootstrap');
 +
 +
window.Vue = require('vue');
 +
 +
/**
 +
* The following block of code may be used to automatically register your
 +
* Vue components. It will recursively scan this directory for the Vue
 +
* components and automatically register them with their "basename".
 +
*
 +
* Eg. ./components/ExampleComponent.vue -> <example-component></example-component>
 +
*/
 +
 +
// const files = require.context('./', true, /\.vue$/i)
 +
// files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default))
 +
 +
Vue.component('example-component', require('./components/ExampleComponent.vue').default);
 +
 +
/**
 +
* Next, we will create a fresh Vue application instance and attach it to
 +
* the page. Then, you may begin adding components to this application
 +
* or customize the JavaScript scaffolding to fit your unique needs.
 +
*/
 +
 +
const app = new Vue({
 +
    el: '#app',
 +
});
 +
</soruce>
 +
*Importante añadir el fichero '''''app.css'''''
 +
{{MRM_Pregunta|Title=Duda mrm|
 +
 +
¿El fichero  app.css vacío ??????
 +
}}
 +
 +
 +
 +
}}

Revisión de 20:55 1 nov 2020



{{MRM_Actividad|Title=Instalación|

Instalamos el paquete laravel/ui o lo incluimos en nuestro compoer.json y actualizamos con composer 
composer require laravel/ui
Con artisan, instalamos vue en nuestro poryecto 
php artisan ui vue
npm install
npm run dev
  • Tras la instalación nos debe de enseñar que ha creado los ficheros correspondientes

Archivo:Instalacion vue laravel1.png

  • Y verificamos el contendio del fichero resources/js/app.js 
/**
 * First we will load all of this project's JavaScript dependencies which
 * includes Vue and other libraries. It is a great starting point when
 * building robust, powerful web applications using Vue and Laravel.
 */
 
require('./bootstrap');
 
window.Vue = require('vue');
 
/**
 * The following block of code may be used to automatically register your
 * Vue components. It will recursively scan this directory for the Vue
 * components and automatically register them with their "basename".
 *
 * Eg. ./components/ExampleComponent.vue -> <example-component></example-component>
 */
 
// const files = require.context('./', true, /\.vue$/i)
// files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default))
 
Vue.component('example-component', require('./components/ExampleComponent.vue').default);
 
/**
 * Next, we will create a fresh Vue application instance and attach it to
 * the page. Then, you may begin adding components to this application
 * or customize the JavaScript scaffolding to fit your unique needs.
 */
 
const app = new Vue({
    el: '#app',
});
</soruce>
*Importante añadir el fichero '''''app.css'''''
{{MRM_Pregunta|Title=Duda mrm|
 
¿El fichero  app.css vacío ??????
}}
 
 
 
}}
Obtenido de «https://es.wikieducator.org/index.php?title=Usuario:ManuelRomero/Laravel/vue&oldid=27455»