question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Example of my experience trying this for the first time, written as a beginner to see if we can find improvements:

  • While working on a new Rails app I thought about using Stimulus.
  • I already have a Rails (5.2) project and do not want another new project. I want to enhance my project with some Javascript goodness.
  • As a inexperienced user with Stimulus I hoped it would feel more welcoming than for example React.
  • And I expected a smooth integration with Rails. Something like: Add this to your Gemfile, hit bundle and go.

But I got dragged into: https://stimulusjs.org/handbook/installing and other manuals and encounter:

Stimulus integrates with the webpack asset packager to automatically load controller files from a folder in your app.

add the stimulus npm package to your JavaScript bundle

(Note that the stimulus-starter project uses the Yarn package manager for dependency management, so make sure you have that installed first.)

Some code I really have no clue of why it’s needed:

// src/application.js
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))

It’s using paths like /src which seem familiar with React, coming from a Rails project they don’t make sense.

It feels like it does not optimally support the nagging sense:

If, on the other hand, you have nagging sense that what you’re working on does not warrant the intense complexity and application separation such contemporary techniques imply, then you’re likely to find refuge in our approach. https://stimulusjs.org/handbook/origin

I don’t know whether I want NPM or Yarn, or how they mix. I don’t want to understand how controllers are loaded. I want to add some javascript feature like the example at the homepage: https://stimulusjs.org

Wouldn’t it be possible to give the installation experience a more Rails like experience?


After a quite long time I found the Discourse forum via one of the issues. There seem to be more people experiencing this at first:

https://discourse.stimulusjs.org/t/organize-controllers-in-rails-app-without-webpacker/224 https://discourse.stimulusjs.org/t/work-with-rails/43

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:7
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

3reactions
lucfrankencommented, May 18, 2018

@adrienpoly Thanks for the link and command! That did it!

The steps I took:

I run:

rails webpacker:install:stimulus

I get error:

rails webpacker:install:stimulus
rails aborted!
Don't know how to build task 'webpacker:install:stimulus' (see --tasks)

What I needed to do:

Add this to Gemfile:

gem 'webpacker', '~> 3.5'

Then:

bundle install

Then I got error:


rails webpacker:install:stimulus
Webpacker requires Yarn >= 0.25.2 and you are using 0.22.0
Please upgrade Yarn https://yarnpkg.com/lang/en/docs/install/
MacBook:myapp lucfranken$ bundle install

Then I go to: https://yarnpkg.com/lang/en/docs/install/ with a complicated story but luckily I had brew installed. So I run:

brew install yarn

That one fails too:

Error: yarn 0.22.0 is already installed
To upgrade to 1.6.0, run `brew upgrade yarn`

Then I run:

brew upgrade yarn

Then I run again:

rails webpacker:install:stimulus

Fails:

webpack binstubs not found.
Have you run rails webpacker:install ?
Make sure the bin directory or binstubs are not included in .gitignore
Exiting!

So I run:

rails webpacker:install

Then I run again:

rails webpacker:install:stimulus

schermafbeelding 2018-05-18 om 11 50 07

🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉 🎉

I then manually added this into application.html.erb layout:

<%= javascript_pack_tag 'application' %>

See, it doesn’t really feel as smooth as installing Rails things. Hopefully this may become more easy in the future. I think for sure that the manual of Stimulus needs to have a clear direction towards your command:

rails webpacker:install:stimulus

Which is essentially the correct installation command but is missing.

3reactions
adrienpolycommented, May 18, 2018

well to install stimulus in rails you can use the official installer

https://github.com/rails/webpacker#stimulus

for a new app rails new myapp --webpack=stimulus

or

to add it to an existing app rails webpacker:install:stimulus

While it is well documented in webpacker a link in the handbook would be nice

Read more comments on GitHub >

github_iconTop Results From Across the Web

STIHL bg86 bg56 sh86 56 recoil starter rope rotor spool ...
STIHL bg86 bg56 sh86 56 recoil starter rope rotor spool non easy start NEW OEM · Item Information · Oops! Looks like we're...
Read more >
EasyStart™ 364 Soft Starter - Micro-Air, Inc.
EasyStart ™ is a one-of-a-kind, custom-developed soft starter for single-phase motors. It employs a 4-part start ramp sequence that is self-optimizing, resulting ...
Read more >
STIHL Easy2Start™ Product Technology & Features
Reliable starting: No matter whether you pull briskly or slowly on the starter rope, the engine attempts to start easily and reliably.
Read more >
Rope start - Wikipedia
Rope start is a method of starting an internal combustion engine, usually on small machines, such as lawn mowers, chainsaws, ultralight aircraft, ...
Read more >
easy start vs pull start - RCU Forums
I usually have big pockets so it doesn't bother me to carry things around, but i like to use the ez-start with the...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found