I can not do this example on my local PC Example Template , if I want to create a template in a separate file where I can call it and use it in any part of my html, in order to simplify code, but I can not do it because I can not identify if I'm missing other CDNs or what else I should do.
This is the 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>
This is the main.js file
import Vue from 'vue'
import App from './App.vue'
new Vue({
el: 'body',
components: { App }
})
This is the Template App.vue
<template>
<h1>{{ msg }}</h1>
</template>
<script>
export default {
data () {
return {
msg: 'Hello Vue!'
}
}
}
</script>
<style scoped>
h1 {
color: red;
}
</style>