Skip to main content
Relanzada por el usuario Comunidad
se eliminaron 502 caracteres en el cuerpo; título editado
Origen Enlace
Shaz
  • 29.2k
  • 18
  • 40
  • 61

Novato: Como hacer Template con Vue.js

Estoy empezando en este mundo de la programación WEB y estaria super agradecido si alguien me orientara en este proceso, ya he estudiado parte de html, css y javascript; y ahora estoy empezando a usar Vue.js para practicar, pero me consigo que noNo logro hacer este ejemplo en mi pc local ejemplo Template, en si quiero crear un template en un archivo aparte donde pueda llamarlo y usarlo en cualquier parte de mi html, con el fin de simplificar codigo, pero no logro hacerlo porque no logro identificar si me faltan otros CDN o que otra cosa debo hacer.

Este es el HTML

<html>
  <head>
    <meta charset="utf-8"/>
  </head>
  <body>
    <app></app>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.28/vue.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/1.0.3/vue-resource.js"></script>
    <script src="main.js"></script>
  </body>
</html>

Este el archivo main.js

import Vue from 'vue'
import App from './App.vue'

new Vue({
  el: 'body',
  components: { App }
})

Este es el Template App.vue

<template>
  <h1>{{ msg }}</h1>
</template>

<script>
export default {
  data () {
    return {
      msg: 'Hello Vue!'
    }
  }
}
</script>

<style scoped>
h1 {
  color: red;
}
</style>

De nuevo mil gracias quien pueda orientarme e indicarme que debo hacer en mi pc local para replicar el ejemplo Template jejeje recuerden que estoy empezando y no manejo toda la parte tecnica ya que esta la obtendre con la practica.

saludos!!

Novato: Como hacer Template con Vue.js

Estoy empezando en este mundo de la programación WEB y estaria super agradecido si alguien me orientara en este proceso, ya he estudiado parte de html, css y javascript; y ahora estoy empezando a usar Vue.js para practicar, pero me consigo que no logro hacer este ejemplo en mi pc local ejemplo Template, en si quiero crear un template en un archivo aparte donde pueda llamarlo y usarlo en cualquier parte de mi html, con el fin de simplificar codigo, pero no logro hacerlo porque no logro identificar si me faltan otros CDN o que otra cosa debo hacer.

Este es el HTML

<html>
  <head>
    <meta charset="utf-8"/>
  </head>
  <body>
    <app></app>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.28/vue.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/1.0.3/vue-resource.js"></script>
    <script src="main.js"></script>
  </body>
</html>

Este el archivo main.js

import Vue from 'vue'
import App from './App.vue'

new Vue({
  el: 'body',
  components: { App }
})

Este es el Template App.vue

<template>
  <h1>{{ msg }}</h1>
</template>

<script>
export default {
  data () {
    return {
      msg: 'Hello Vue!'
    }
  }
}
</script>

<style scoped>
h1 {
  color: red;
}
</style>

De nuevo mil gracias quien pueda orientarme e indicarme que debo hacer en mi pc local para replicar el ejemplo Template jejeje recuerden que estoy empezando y no manejo toda la parte tecnica ya que esta la obtendre con la practica.

saludos!!

Como hacer Template con Vue.js

No logro hacer este ejemplo en mi pc local ejemplo Template, en si quiero crear un template en un archivo aparte donde pueda llamarlo y usarlo en cualquier parte de mi html, con el fin de simplificar codigo, pero no logro hacerlo porque no logro identificar si me faltan otros CDN o que otra cosa debo hacer.

Este es el HTML

<html>
  <head>
    <meta charset="utf-8"/>
  </head>
  <body>
    <app></app>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.28/vue.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/1.0.3/vue-resource.js"></script>
    <script src="main.js"></script>
  </body>
</html>

Este el archivo main.js

import Vue from 'vue'
import App from './App.vue'

new Vue({
  el: 'body',
  components: { App }
})

Este es el Template App.vue

<template>
  <h1>{{ msg }}</h1>
</template>

<script>
export default {
  data () {
    return {
      msg: 'Hello Vue!'
    }
  }
}
</script>

<style scoped>
h1 {
  color: red;
}
</style>

Origen Enlace

Novato: Como hacer Template con Vue.js

Estoy empezando en este mundo de la programación WEB y estaria super agradecido si alguien me orientara en este proceso, ya he estudiado parte de html, css y javascript; y ahora estoy empezando a usar Vue.js para practicar, pero me consigo que no logro hacer este ejemplo en mi pc local ejemplo Template, en si quiero crear un template en un archivo aparte donde pueda llamarlo y usarlo en cualquier parte de mi html, con el fin de simplificar codigo, pero no logro hacerlo porque no logro identificar si me faltan otros CDN o que otra cosa debo hacer.

Este es el HTML

<html>
  <head>
    <meta charset="utf-8"/>
  </head>
  <body>
    <app></app>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.28/vue.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue-resource/1.0.3/vue-resource.js"></script>
    <script src="main.js"></script>
  </body>
</html>

Este el archivo main.js

import Vue from 'vue'
import App from './App.vue'

new Vue({
  el: 'body',
  components: { App }
})

Este es el Template App.vue

<template>
  <h1>{{ msg }}</h1>
</template>

<script>
export default {
  data () {
    return {
      msg: 'Hello Vue!'
    }
  }
}
</script>

<style scoped>
h1 {
  color: red;
}
</style>

De nuevo mil gracias quien pueda orientarme e indicarme que debo hacer en mi pc local para replicar el ejemplo Template jejeje recuerden que estoy empezando y no manejo toda la parte tecnica ya que esta la obtendre con la practica.

saludos!!