Importmap Rails and Stimulus when working with Rails Engines

  Kiến thức lập trình

I’m unable to get stimulus and importmaps to read files from an app engine. The current project I’ve been tasked to do involves me upgrading all legacy engines to use importmaps and stimulus JS. The documentation is a bit misleading as it does not work the way any of the documentation lays out to use them.

Note :: I did not choose app structure, I’m working with what I was given and it is not my place to decide that the current structure is correct or incorrect, so please assume that this is my only option for structure.

Structure

Main App (Rails ==> gem ‘Engine 1’, gem ‘Engine 2’) only it works as a nested rails app.

— Engine 1

— Engine 2

— Engine 3

The Main App Code

  • The main app includes all the manifest files and has a working stimulus setup for the items that the main app controls.

The Engine Code

  • When Using a <%= javascript_importmap_tags %> in the engine, the main apps controls are loading, but none of the engines javascript controllers. Documentation says that it needs an importmap and it needs its own manifest etc.

engines/myengine/assets/config/myengine/manifest.js

//= link_tree ../../images/appetite
//= link_directory ../../stylesheets/appetite .css
//= link_directory ../../stylesheets/appetite .scss
//= link_tree  ../../../javascript

engines/myengine/config/importmap.rb

pin_all_from "app/javascript/controllers", under: "controllers/myengine"

engines/myengine/lib/myengine/engine.rb

# engines/appetite/lib/appetite/engine.rb
module MyEngine
  class Engine < ::Rails::Engine
    isolate_namespace MyEngine
    initializer :importmap, before: :importmap do |app|
      app.config.importmap.paths << root.join('config/importmap.rb')
    end
  end
end

engine/…/example_controller.js

import { Controller } from "@hotwired/stimulus";

export default class extends Controller {
  connect() {
    console.log("Example controller connected");
  }
}

I’ve tried lots of steps in between and even tried just linking pinning the files from the main app, but nothing seems to work. Any ideas and help would be appreciated.

Theme wordpress giá rẻ Theme wordpress giá rẻ Thiết kế website

LEAVE A COMMENT