Add generator for installation

Author: nning

README.md

@@ -12,21 +12,23 @@ Make sure, you have [set-up Webpacker](https://github.com/rails/webpacker#instal
 Add this line to your application's Gemfile:
 
 ```ruby
-gem 'svelte-rails'
+gem 'svelte-rails', path: '../svelte-rails'
 ```
 
 And then execute:
 
-    $ bundle install
-    $ rails generate svelte:install
+    $ bundle
+    $ rails svelte:install
 
-An example Rails app with svelte-rails can be seen here:  
-https://github.com/nning/rails-svelte-poc
+If you have started with a fresh Rails app, you can overwrite conflicting files.
+
+An example Rails app demonstrating the integration of svelte-rails can be found here:  
+https://github.com/nning/svelte-rails-demo/commits/master
 
 ## View Helper
 
 ```erb
-<%= svelte_component(:Hello, name: 'Svelte') %>
+<%= svelte_component :Hello, name: 'Svelte' %>
 ```
 
 ## Missing Features

lib/svelte/rails.rb

@@ -2,8 +2,7 @@
 
 module Svelte
   module Rails
-    class Error < StandardError; end
-    # Your code goes here...
+    # class Error < StandardError; end
   end
 end
 

lib/svelte/rails/install_generator.rb

@@ -0,0 +1,71 @@
+require 'rails/generators'
+
+
+module Svelte
+  class InstallGenerator < ::Rails::Generators::Base
+    TEMPLATE_DIR = File.expand_path('../templates', __FILE__)
+    source_root TEMPLATE_DIR
+
+    desc 'Install Svelte support'
+
+    def create_directories
+      empty_directory components_dir
+      create_file File.join(components_dir, '.keep')
+    end
+
+    def copy_templates
+      copy_template(webpack_dir, 'environment.js')
+      copy_template(webpack_dir, 'development.js')
+      copy_template(webpack_dir, 'production.js')
+      copy_template(webpack_dir, 'test.js')
+
+      copy_template(webpack_dir, 'loaders', 'svelte.js')
+      copy_template(webpack_dir, 'loaders', 'svelte-ssr.js')
+
+      copy_template(packs_dir, 'server_rendering.js')
+      copy_template(components_dir, 'Hello.svelte')
+    end
+
+    def update_application_entry
+      path = Pathname.new('app/javascript/packs/application.js')
+      content = File.read(File.join(TEMPLATE_DIR, path))
+
+      if path.exist?
+        append_file(path, content)
+      else
+        create_file(path, content)
+      end
+    end
+
+    def install_svelte_ujs
+      `yarn add ../svelte-rails`
+    end
+
+    private
+
+    def rails_dir
+      Pathname.new(destination_root).relative_path_from(::Rails.root)
+    end
+
+    def packs_dir
+      Webpacker.config.source_entry_path.relative_path_from(::Rails.root)
+    end
+
+    def js_dir
+      packs_dir.parent
+    end
+
+    def components_dir
+      File.join(js_dir, 'components')
+    end
+
+    def webpack_dir
+      File.join(rails_dir, 'config', 'webpack')
+    end
+
+    def copy_template(*path_segments)
+      source = File.join(*path_segments)
+      template(source, ::Rails.root.join(source))
+    end
+  end
+end

lib/svelte/rails/install_task.rake

@@ -0,0 +1,8 @@
+require 'svelte/rails/install_generator'
+
+namespace :svelte do
+  desc 'Install Svelte support'
+  task :install do
+    Svelte::InstallGenerator.start
+  end
+end

lib/svelte/rails/railtie.rb

@@ -7,5 +7,9 @@ class Railtie < ::Rails::Railtie
         include ::Svelte::Rails::ViewHelper
       end
     end
+
+    rake_tasks do
+      load 'svelte/rails/install_task.rake'
+    end
   end
 end

lib/svelte/rails/templates/app/javascript/components/Hello.svelte

@@ -0,0 +1,36 @@
+<svelte:head>
+	<title>Hello {name}! ❤</title>
+</svelte:head>
+
+<script>
+  import { onMount } from 'svelte'
+
+  export let name
+  let time
+
+  onMount(() => {
+    const interval = setInterval(() => {
+      time = new Date();
+    }, 1000);
+
+    return () => {
+      clearInterval(interval);
+    };
+  });
+</script>
+
+<style>
+  :global(body) {
+    background-color: #223;
+  }
+
+  h1, code {
+    color: #fee;
+  }
+</style>
+
+<h1>Hello {name}! ❤</h1>
+
+{#if time}
+  <code>{time}</code>
+{/if}

lib/svelte/rails/templates/app/javascript/packs/application.js

@@ -0,0 +1,3 @@
+import SvelteRailsUJS from 'svelte_ujs';
+self.SvelteRailsUJS = SvelteRailsUJS;
+SvelteRailsUJS.start();

lib/svelte/rails/templates/app/javascript/packs/server_rendering.js

@@ -0,0 +1,3 @@
+import SvelteRailsUJS from 'svelte_ujs';
+
+self.SvelteRailsUJS = SvelteRailsUJS;

lib/svelte/rails/templates/config/webpack/development.js

@@ -0,0 +1,5 @@
+process.env.NODE_ENV = process.env.NODE_ENV || 'development'
+
+const environment = require('./environment')
+
+module.exports = environment.map(x => x.toWebpackConfig())

lib/svelte/rails/templates/config/webpack/environment.js

@@ -0,0 +1,6 @@
+const clientLoader = require('./loaders/svelte')
+const serverLoader = require('./loaders/svelte-ssr')
+
+const getSvelteEnvironments = require('svelte_ujs/getSvelteEnvironments')
+
+module.exports = getSvelteEnvironments(clientLoader, serverLoader)

lib/svelte/rails/templates/config/webpack/loaders/svelte-ssr.js

@@ -0,0 +1,11 @@
+module.exports = {
+  test: /\.svelte$/,
+  use: [{
+    loader: 'svelte-loader',
+    options: {
+      generate: 'ssr',
+      emitCss: false,
+      css: false
+    }
+  }],
+}

lib/svelte/rails/templates/config/webpack/loaders/svelte.js

@@ -0,0 +1,10 @@
+module.exports = {
+  test: /\.svelte$/,
+  use: [{
+    loader: 'svelte-loader',
+    options: {
+      hotReload: true,
+      hydratable: true
+    }
+  }],
+}

lib/svelte/rails/templates/config/webpack/production.js

@@ -0,0 +1,5 @@
+process.env.NODE_ENV = process.env.NODE_ENV || 'production'
+
+const environment = require('./environment')
+
+module.exports = environment.map(x => x.toWebpackConfig())

lib/svelte/rails/templates/config/webpack/test.js

@@ -0,0 +1,5 @@
+process.env.NODE_ENV = process.env.NODE_ENV || 'development'
+
+const environment = require('./environment')
+
+module.exports = environment.map(x => x.toWebpackConfig())