diff --git a/plop-templates/component/index.hbs b/plop-templates/component/index.hbs
new file mode 100644
index 00000000..76610552
--- /dev/null
+++ b/plop-templates/component/index.hbs
@@ -0,0 +1,26 @@
+{{#if template}}
+<template>
+  <div />
+</template>
+{{/if}}
+
+{{#if script}}
+<script>
+export default {
+  name: '{{ properCase name }}',
+  props: {},
+  data() {
+    return {}
+  },
+  created() {},
+  mounted() {},
+  methods: {}
+}
+</script>
+{{/if}}
+
+{{#if style}}
+<style lang="scss" scoped>
+
+</style>
+{{/if}}
diff --git a/plop-templates/component/index.vue b/plop-templates/component/index.vue
deleted file mode 100644
index 326c7251..00000000
--- a/plop-templates/component/index.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-<template lang="pug">
-  div
-  {{banana}}
-</template>
-<script lang="ts">
-import Vue from 'vue'
-export default Vue.extend({
-
-})
-</script>
-<style lang="scss" scoped>
-
-</style>
diff --git a/plop-templates/component/prompt.js b/plop-templates/component/prompt.js
new file mode 100644
index 00000000..3723e8e1
--- /dev/null
+++ b/plop-templates/component/prompt.js
@@ -0,0 +1,55 @@
+const { notEmpty } = require('../utils.js')
+
+module.exports = {
+  description: 'generate vue component',
+  prompts: [{
+    type: 'input',
+    name: 'name',
+    message: 'component name please',
+    validate: notEmpty('name')
+  },
+  {
+    type: 'checkbox',
+    name: 'blocks',
+    message: 'Blocks:',
+    choices: [{
+      name: '<template>',
+      value: 'template',
+      checked: true
+    },
+    {
+      name: '<script>',
+      value: 'script',
+      checked: true
+    },
+    {
+      name: 'style',
+      value: 'style',
+      checked: true
+    }
+    ],
+    validate(value) {
+      if (value.indexOf('script') === -1 && value.indexOf('template') === -1) {
+        return 'Components require at least a <script> or <template> tag.'
+      }
+      return true
+    }
+  }
+  ],
+  actions: data => {
+    const name = '{{properCase name}}'
+    const actions = [{
+      type: 'add',
+      path: `src/components/${name}/index.vue`,
+      templateFile: 'plop-templates/component/index.hbs',
+      data: {
+        name: name,
+        template: data.blocks.includes('template'),
+        script: data.blocks.includes('script'),
+        style: data.blocks.includes('style')
+      }
+    }]
+
+    return actions
+  }
+}
diff --git a/plop-templates/utils.js b/plop-templates/utils.js
new file mode 100644
index 00000000..0310ca02
--- /dev/null
+++ b/plop-templates/utils.js
@@ -0,0 +1,9 @@
+exports.notEmpty = name => {
+  return v => {
+    if (!v || v.trim === '') {
+      return `${name} is required`
+    } else {
+      return true
+    }
+  }
+}
diff --git a/plop-templates/view/index.hbs b/plop-templates/view/index.hbs
new file mode 100644
index 00000000..76610552
--- /dev/null
+++ b/plop-templates/view/index.hbs
@@ -0,0 +1,26 @@
+{{#if template}}
+<template>
+  <div />
+</template>
+{{/if}}
+
+{{#if script}}
+<script>
+export default {
+  name: '{{ properCase name }}',
+  props: {},
+  data() {
+    return {}
+  },
+  created() {},
+  mounted() {},
+  methods: {}
+}
+</script>
+{{/if}}
+
+{{#if style}}
+<style lang="scss" scoped>
+
+</style>
+{{/if}}
diff --git a/plop-templates/view/prompt.js b/plop-templates/view/prompt.js
new file mode 100644
index 00000000..1d490ee8
--- /dev/null
+++ b/plop-templates/view/prompt.js
@@ -0,0 +1,55 @@
+const { notEmpty } = require('../utils.js')
+
+module.exports = {
+  description: 'generate a view',
+  prompts: [{
+    type: 'input',
+    name: 'name',
+    message: 'view name please',
+    validate: notEmpty('name')
+  },
+  {
+    type: 'checkbox',
+    name: 'blocks',
+    message: 'Blocks:',
+    choices: [{
+      name: '<template>',
+      value: 'template',
+      checked: true
+    },
+    {
+      name: '<script>',
+      value: 'script',
+      checked: true
+    },
+    {
+      name: 'style',
+      value: 'style',
+      checked: true
+    }
+    ],
+    validate(value) {
+      if (value.indexOf('script') === -1 && value.indexOf('template') === -1) {
+        return 'View require at least a <script> or <template> tag.'
+      }
+      return true
+    }
+  }
+  ],
+  actions: data => {
+    const name = '{{name}}'
+    const actions = [{
+      type: 'add',
+      path: `src/views/${name}/index.vue`,
+      templateFile: 'plop-templates/view/index.hbs',
+      data: {
+        name: name,
+        template: data.blocks.includes('template'),
+        script: data.blocks.includes('script'),
+        style: data.blocks.includes('style')
+      }
+    }]
+
+    return actions
+  }
+}
diff --git a/plopfile.js b/plopfile.js
index a016be6c..9f3147e2 100644
--- a/plopfile.js
+++ b/plopfile.js
@@ -1,61 +1,7 @@
-const notEmpty = name => {
-  return v => {
-    if (!v || v.trim === '') {
-      return `${name} is required`
-    } else {
-      return true
-    }
-  }
-}
+const viewGenerator = require('./plop-templates/view/prompt')
+const componentGenerator = require('./plop-templates/component/prompt')
 
 module.exports = function(plop) {
-  const name = '{{ properCase name }}'
-  plop.setGenerator('component', {
-    description: 'generate vue component',
-    prompts: [{
-      type: 'input',
-      name: 'name',
-      message: 'component name please',
-      validate: notEmpty('name')
-    },
-    {
-      type: 'checkbox',
-      name: 'blocks',
-      message: 'Blocks:',
-      choices: [
-        {
-          name: '<template>',
-          value: 'template',
-          checked: true
-        },
-        {
-          name: '<script>',
-          value: 'script',
-          checked: true
-        },
-        {
-          name: '<style>',
-          value: 'style',
-          checked: true
-        }
-      ],
-      validate(value) {
-        if (value.indexOf('script') === -1 && value.indexOf('template') === -1) {
-          return 'Components require at least a <script> or <template> tag.'
-        }
-        return true
-      }
-    }
-    ],
-    actions: [{
-      type: 'add',
-      path: `src/components/${name}/index.vue`,
-      templateFile: 'plop-templates/component/index.vue',
-      data: {
-        banana: 'banana'
-      }
-    }]
-  })
-
-  plop.setGenerator('none', {})
+  plop.setGenerator('view', viewGenerator)
+  plop.setGenerator('component', componentGenerator)
 }