diff options
Diffstat (limited to 'master/src/components')
| -rw-r--r-- | master/src/components/HelloWorld.vue | 64 | 
1 files changed, 64 insertions, 0 deletions
diff --git a/master/src/components/HelloWorld.vue b/master/src/components/HelloWorld.vue new file mode 100644 index 0000000..f68982b --- /dev/null +++ b/master/src/components/HelloWorld.vue @@ -0,0 +1,64 @@ +<template> +  <div class="hello"> +    <h1>{{ msg }}</h1> +    <p> +      For a guide and recipes on how to configure / customize this project,<br> +      check out the +      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>. +    </p> +    <h3>Installed CLI Plugins</h3> +    <ul> +      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li> +      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li> +      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li> +      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript" target="_blank" rel="noopener">typescript</a></li> +    </ul> +    <h3>Essential Links</h3> +    <ul> +      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li> +      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li> +      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li> +      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li> +      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li> +    </ul> +    <h3>Ecosystem</h3> +    <ul> +      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li> +      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li> +      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li> +      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li> +      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li> +    </ul> +  </div> +</template> + +<script lang="ts"> +import { Options, Vue } from 'vue-class-component' + +@Options({ +  props: { +    msg: String +  } +}) +export default class HelloWorld extends Vue { +  msg!: string +} +</script> + +<!-- Add "scoped" attribute to limit CSS to this component only --> +<style scoped lang="scss"> +h3 { +  margin: 40px 0 0; +} +ul { +  list-style-type: none; +  padding: 0; +} +li { +  display: inline-block; +  margin: 0 10px; +} +a { +  color: #42b983; +} +</style>  | 
