fix broken hello world component

Author: maurop123

README.md

@@ -1,7 +1,6 @@
 # vue-cli-plugin-vuetify
-Plugin for vue-cli@3.0
 
-If you want to try out the new vue-cli 3 to make an app using Vuetify, this plugin will set up Vuetify hassle-free.
+Vuetify Plugin for [vue-cli@3.0](https://github.com/vuejs/vue-cli)
 
 ## Install
 
@@ -21,4 +20,68 @@ To install the vuetify plugin...
 vue add vuetify
 ```
 
-That's it! Let us know what you think on [discord](https://discordapp.com/channels/340160225338195969/340160225338195969).
+If you run into any issues you can hit us up on [discord/need](https://discordapp.com/channels/340160225338195969/340215499398840331).
+
+## Using with other plugins
+
+Here are some extra steps for setting up the old templates but using plugins from the new ecosystem.
+
+## Nuxt
+
+```
+# preset: default (babel, eslint)
+
+vue add nuxt-starter-template
+
+```
+
+Todo
+
+- Add vuetify Nuxt starter template
+
+
+### Electron
+
+Just add [vue-cli-plugin-electron-builder](https://www.npmjs.com/package/vue-cli-plugin-electron-builder)
+
+```
+# preset: default (babel, eslint)
+
+vue add vuetify electron-builder vuetify
+yarn server:electron
+```
+
+Gotcha
+
+- If you add vuetify before electron-builder, electron-builder will overwrite Vuetify's App.vue and HelloWorld.vue
+
+Todo
+
+- material icons aren't properly included
+
+### PWA
+
+If you already made a project with the PWA option selected, then just adding like above should do it.
+
+Otherwise...
+
+Todo
+
+- check if can add PWA plugin after now without old bug
+
+### Cordova (not working yet)
+
+https://www.npmjs.com/package/vue-cli-plugin-cordova
+
+
+Gotcha
+
+-  `semver module not found`
+ - fix with `yarn add -D semver`
+
+Todo
+
+- can i skip `yarn cordova:build`?
+
+## Typescript Support
+

generator/index.js

@@ -36,7 +36,7 @@ module.exports = (api, opts, rootOpts) => {
     if (opts.router) {
       files['./src/views/Home.vue'] = './templates/default/src/views/Home.vue'
     } else {
-      files['./src/components/HelloWorld.vue'] = './templates/default/src/components/HelloWorld.vue'
+      api.render('./templates/hw')
     }
 
     api.render(files, opts)

generator/templates/hw/src/components/HelloWorld.vue

@@ -0,0 +1,46 @@
+---
+extend: '@vue/cli-service/generator/template/src/components/HelloWorld.vue'
+replace: 
+  - !!js/regexp /<template>[^]*?<\/template>/
+  - !!js/regexp /<style.*>[^]*?<\/style>/
+---
+
+<%# REPLACE %>
+<template>
+  <v-container fluid>
+    <v-slide-y-transition mode="out-in">
+      <v-layout column align-center>
+        <img src="@/assets/logo.png" alt="Vuetify.js" class="mb-5">
+        <blockquote>
+          &#8220;First, solve the problem. Then, write the code.&#8221;
+          <footer>
+            <small>
+              <em>&mdash;John Johnson</em>
+            </small>
+          </footer>
+        </blockquote>
+      </v-layout>
+    </v-slide-y-transition>
+  </v-container>
+</template>
+<%# END_REPLACE %>
+
+<%# REPLACE %>
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+h1, h2 {
+  font-weight: normal;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+a {
+  color: #42b983;
+}
+</style>
+<%# END_REPLACE %>