Merge pull request #65 from ElMassimo/vue-template

feat: Implement generator for Vue apps

Author: bknoles

lib/generators/inertia_rails/install/react.jsx renamed to lib/generators/inertia_rails/install/react/InertiaExample.jsx

@@ -0,0 +1,11 @@
+<template>
+  <h1 :style="{ 'text-align': 'center' }">Hello {{name}}!</h1>
+</template>
+
+<script>
+export default {
+  props: {
+    name: { type: String, required: true },
+  },
+}
+</script>

lib/generators/inertia_rails/install/inertia.jsx renamed to lib/generators/inertia_rails/install/react/inertia.jsx

@@ -0,0 +1,24 @@
+import axios from 'axios'
+import Vue from 'vue'
+
+import { app, plugin } from '@inertiajs/inertia-vue'
+import { InertiaProgress } from '@inertiajs/progress'
+
+document.addEventListener('DOMContentLoaded', () => {
+  const csrfToken = document.querySelector('meta[name=csrf-token]').content
+  axios.defaults.headers.common['X-CSRF-Token'] = csrfToken
+
+  InertiaProgress.init();
+  const el = document.getElementById('app')
+
+  Vue.use(plugin)
+
+  new Vue({
+    render: h => h(app, {
+      props: {
+        initialPage: JSON.parse(el.dataset.page),
+        resolveComponent: name => require(`../Pages/${name}`).default,
+      },
+    }),
+  }).$mount(el)
+})

lib/generators/inertia_rails/install/vue/InertiaExample.vue

@@ -5,6 +5,7 @@ class InstallGenerator < Rails::Generators::Base
 
     FRONT_END_INSTALLERS = [
       'react',
+      'vue',
     ]
 
     def install
@@ -32,6 +33,8 @@ def installable?
 
         return false
       end
+
+      true
     end
 
     def install_base!
@@ -53,10 +56,19 @@ def install_base!
     def install_react!
       say "Creating a React page component...", :blue
       run 'yarn add @inertiajs/inertia-react'
-      template "react.jsx", Rails.root.join("app/javascript/Pages/InertiaExample.js").to_s
+      template "react/InertiaExample.jsx", Rails.root.join("app/javascript/Pages/InertiaExample.js").to_s
       say "Copying inertia.jsx into webpacker's packs folder...", :blue
-      template "inertia.jsx", Rails.root.join("app/javascript/packs/inertia.jsx").to_s
+      template "react/inertia.jsx", Rails.root.join("app/javascript/packs/inertia.jsx").to_s
+      say "done!", :green
+    end
+
+    def install_vue!
+      say "Creating a Vue page component...", :blue
+      run 'yarn add @inertiajs/inertia-vue'
+      template "vue/InertiaExample.vue", Rails.root.join("app/javascript/Pages/InertiaExample.vue").to_s
+      say "Copying inertia.js into webpacker's packs folder...", :blue
+      template "vue/inertia.js", Rails.root.join("app/javascript/packs/inertia.js").to_s
       say "done!", :green
     end
   end
-end
+end