Merge pull request #1255 from ytbryan/stimulus-default-pack

Support Stimulus Default Pack

README.md

@@ -30,6 +30,7 @@ in which case you may not even need the asset pipeline. This is mostly relevant
   - [Angular with TypeScript](#angular-with-typescript)
   - [Vue](#vue)
   - [Elm](#elm)
+  - [Stimulus](#stimulus)
   - [Coffeescript](#coffeescript)
   - [Erb](#erb)
 - [Paths](#paths)
@@ -325,6 +326,20 @@ The Elm library and core packages will be added via Yarn and Elm itself.
 An example `Main.elm` app will also be added to your project in `app/javascript`
 so that you can experiment with Elm right away.
 
+### Stimulus
+
+To use Webpacker with [Stimulus](http://stimulusjs.org), create a
+new Rails 5.1+ app using `--webpack=stimulus` option:
+
+```
+# Rails 5.1+
+rails new myapp --webpack=stimulus
+```
+
+(or run `bundle exec rails webpacker:install:stimulus` on a Rails app already setup with Webpacker).
+
+Please read [The Stimulus Handbook](https://stimulusjs.org/handbook/introduction) or learn more about its source code at https://github.com/stimulusjs/stimulus
+
 ### Coffeescript
 
 To add [Coffeescript](http://coffeescript.org/) support,

lib/install/examples/stimulus/application.js

@@ -0,0 +1,6 @@
+import { Application } from "stimulus"
+import { definitionsFromContext } from "stimulus/webpack-helpers"
+
+const application = Application.start()
+const context = require.context("controllers", true, /.js$/)
+application.load(definitionsFromContext(context))

lib/install/examples/stimulus/controllers/hello_controller.js

@@ -0,0 +1,18 @@
+// Visit The Stimulus Handbook for more details 
+// https://stimulusjs.org/handbook/introduction
+// 
+// This example controller works with specially annotated HTML like:
+//
+// <div data-controller="hello">
+//   <h1 data-target="hello.output"></h1>
+// </div>
+
+import { Controller } from "stimulus"
+
+export default class extends Controller {
+  static targets = [ "output" ]
+
+  connect() {
+    this.outputTarget.textContent = 'Hello, Stimulus!'
+  }
+}

lib/install/stimulus.rb

@@ -0,0 +1,12 @@
+say "Appending Stimulus setup code to #{Webpacker.config.source_entry_path}/application.js"
+append_to_file "#{Webpacker.config.source_entry_path}/application.js" do
+  "\n" + open("#{__dir__}/examples/stimulus/application.js").read
+end
+
+say "Creating controllers directory"
+directory "#{__dir__}/examples/stimulus/controllers", "#{Webpacker.config.source_path}/controllers"
+
+say "Installing all Stimulus dependencies"
+run "yarn add stimulus"
+
+say "Webpacker now supports Stimulus.js 🎉", :green

lib/tasks/installers.rake

@@ -5,7 +5,8 @@ installers = {
   "Vue": :vue,
   "Erb": :erb,
   "Coffee": :coffee,
-  "Typescript": :typescript
+  "Typescript": :typescript,
+  "Stimulus": :stimulus
 }.freeze
 
 dependencies = {

lib/tasks/webpacker.rake

@@ -11,6 +11,7 @@ tasks = {
   "webpacker:install:vue"             => "Installs and setup example Vue component",
   "webpacker:install:angular"         => "Installs and setup example Angular component",
   "webpacker:install:elm"             => "Installs and setup example Elm component",
+  "webpacker:install:stimulus"        => "Installs and setup example Stimulus component",
   "webpacker:install:erb"             => "Installs Erb loader with an example",
   "webpacker:install:coffee"          => "Installs CoffeeScript loader with an example",
   "webpacker:install:typescript"      => "Installs Typescript loader with an example"