Fix importmaps using importmap-rails (#772)

* Fix importmaps using importmap-rails * Update to importmap-rails * Updated gemspec
SpinaCMS · Aug 11, 2021 · d06f4f3 · d06f4f3
1 parent 1a40468
commit d06f4f3
Show file tree

Hide file tree

Showing 40 changed files with 83 additions and 114 deletions.
diff --git a/Gemfile.lock b/Gemfile.lock
@@ -8,15 +8,16 @@ PATH
       bcrypt
       breadcrumbs_on_rails
       image_processing
+      importmap-rails (>= 0.1.1)
       jsonapi-serializer
       kaminari
-      mobility (= 1.1.3)
+      mobility (>= 1.1.3)
       pg
       rack-rewrite (>= 1.5.0)
       rails (>= 6.0)
       sass-rails
-      stimulus-rails
-      turbo-rails
+      stimulus-rails (>= 0.3.0)
+      turbo-rails (>= 0.7.0)
       view_component (~> 2.32)
 
 GEM
@@ -103,13 +104,15 @@ GEM
     factory_bot (6.2.0)
       activesupport (>= 5.0.0)
     ffi (1.15.3)
-    globalid (0.4.2)
-      activesupport (>= 4.2.0)
+    globalid (0.5.2)
+      activesupport (>= 5.0)
     i18n (1.8.10)
       concurrent-ruby (~> 1.0)
     image_processing (1.12.1)
       mini_magick (>= 4.9.5, < 5)
       ruby-vips (>= 2.0.17, < 3)
+    importmap-rails (0.1.1)
+      rails (>= 6.0.0)
     json (2.5.1)
     jsonapi-serializer (2.2.0)
       activesupport (>= 4.2)
@@ -129,7 +132,7 @@ GEM
       addressable (~> 2.7)
     letter_opener (1.7.0)
       launchy (~> 2.2)
-    loofah (2.10.0)
+    loofah (2.12.0)
       crass (~> 1.0.2)
       nokogiri (>= 1.5.9)
     mail (2.7.1)
@@ -138,7 +141,7 @@ GEM
     method_source (1.0.0)
     mini_magick (4.11.0)
     mini_mime (1.1.0)
-    mini_portile2 (2.5.3)
+    mini_portile2 (2.6.1)
     minitest (5.14.4)
     minitest-reporters (1.4.3)
       ansi
@@ -149,9 +152,9 @@ GEM
       i18n (>= 0.6.10, < 2)
       request_store (~> 1.0)
     mocha (1.13.0)
-    nio4r (2.5.7)
-    nokogiri (1.11.7)
-      mini_portile2 (~> 2.5.0)
+    nio4r (2.5.8)
+    nokogiri (1.12.3)
+      mini_portile2 (~> 2.6.1)
       racc (~> 1.4)
     pg (1.2.3)
     pry (0.14.1)
@@ -225,11 +228,11 @@ GEM
       actionpack (>= 4.0)
       activesupport (>= 4.0)
       sprockets (>= 3.0.0)
-    stimulus-rails (0.2.4)
+    stimulus-rails (0.3.0)
       rails (>= 6.0.0)
     thor (1.1.0)
     tilt (2.0.10)
-    turbo-rails (0.6.0)
+    turbo-rails (0.7.0)
       rails (>= 6.0.0)
     tzinfo (2.0.4)
       concurrent-ruby (~> 1.0)

diff --git a/app/assets/config/spina/manifest.js b/app/assets/config/spina/manifest.js
@@ -6,3 +6,4 @@
 
 //= link spina/application.css
 
+//= link spina/application.js
diff --git a/app/assets/javascripts/spina/application.js b/app/assets/javascripts/spina/application.js
@@ -0,0 +1,2 @@
+import "@hotwired/turbo-rails"
+import "@hotwired/stimulus-autoloader"
diff --git a/app/assets/javascripts/spina/controllers/attachment_picker_controller.js b/app/assets/javascripts/spina/controllers/attachment_picker_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/autofocus_controller.js b/app/assets/javascripts/spina/controllers/autofocus_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/button_controller.js b/app/assets/javascripts/spina/controllers/button_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/confetti_controller.js b/app/assets/javascripts/spina/controllers/confetti_controller.js
@@ -1,5 +1,5 @@
-import { Controller } from "stimulus"
-import confetti from "canvas-confetti"
+import { Controller } from "@hotwired/stimulus"
+import confetti from "libraries/canvas-confetti"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/confirm_controller.js b/app/assets/javascripts/spina/controllers/confirm_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/delegate_click_controller.js b/app/assets/javascripts/spina/controllers/delegate_click_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/exists_controller.js b/app/assets/javascripts/spina/controllers/exists_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/form_controller.js b/app/assets/javascripts/spina/controllers/form_controller.js
@@ -1,5 +1,5 @@
-import { Controller } from "stimulus"
-import formRequestSubmitPolyfill from 'form-request-submit-polyfill'
+import { Controller } from "@hotwired/stimulus"
+import formRequestSubmitPolyfill from "libraries/form-request-submit-polyfill"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/hotkeys_controller.js b/app/assets/javascripts/spina/controllers/hotkeys_controller.js
@@ -1,5 +1,5 @@
-import { Controller } from "stimulus"
-import hotkeys from "hotkeys"
+import { Controller } from "@hotwired/stimulus"
+import hotkeys from "libraries/hotkeys"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/image_collection_controller.js b/app/assets/javascripts/spina/controllers/image_collection_controller.js
@@ -1,5 +1,5 @@
-import { Controller } from "stimulus"
-import Sortable from "sortablejs"
+import { Controller } from "@hotwired/stimulus"
+import Sortable from "libraries/sortablejs"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/image_fade_in_controller.js b/app/assets/javascripts/spina/controllers/image_fade_in_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/infinite_scroll_controller.js b/app/assets/javascripts/spina/controllers/infinite_scroll_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/loading_button_controller.js b/app/assets/javascripts/spina/controllers/loading_button_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/media_picker_controller.js b/app/assets/javascripts/spina/controllers/media_picker_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/media_picker_modal_controller.js b/app/assets/javascripts/spina/controllers/media_picker_modal_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/modal_controller.js b/app/assets/javascripts/spina/controllers/modal_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/navigation_controller.js b/app/assets/javascripts/spina/controllers/navigation_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/parent_pages_controller.js b/app/assets/javascripts/spina/controllers/parent_pages_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/repeater_controller.js b/app/assets/javascripts/spina/controllers/repeater_controller.js
@@ -1,5 +1,5 @@
-import { Controller } from "stimulus"
-import Sortable from "sortablejs"
+import { Controller } from "@hotwired/stimulus"
+import Sortable from "libraries/sortablejs"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/select_placeholder_controller.js b/app/assets/javascripts/spina/controllers/select_placeholder_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/controllers/selectable_controller.js b/app/assets/javascripts/spina/controllers/selectable_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/shortcuts_controller.js b/app/assets/javascripts/spina/controllers/shortcuts_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/sortable_controller.js b/app/assets/javascripts/spina/controllers/sortable_controller.js
@@ -1,6 +1,6 @@
-import { Controller } from "stimulus"
-import Sortable from "sortablejs"
-import formRequestSubmitPolyfill from 'form-request-submit-polyfill'
+import { Controller } from "@hotwired/stimulus"
+import Sortable from "libraries/sortablejs"
+import formRequestSubmitPolyfill from "libraries/form-request-submit-polyfill"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/switch_controller.js b/app/assets/javascripts/spina/controllers/switch_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/tabs_controller.js b/app/assets/javascripts/spina/controllers/tabs_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/toggle_controller.js b/app/assets/javascripts/spina/controllers/toggle_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/trix_controller.js b/app/assets/javascripts/spina/controllers/trix_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static get targets() {

diff --git a/app/assets/javascripts/spina/controllers/unique_id_controller.js b/app/assets/javascripts/spina/controllers/unique_id_controller.js
@@ -1,4 +1,4 @@
-import { Controller } from "stimulus"
+import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
 

diff --git a/app/assets/javascripts/spina/importmap.json.erb b/app/assets/javascripts/spina/importmap.json.erb
diff --git a/app/assets/javascripts/spina/libraries/[email protected] b/app/assets/javascripts/spina/libraries/[email protected]
@@ -1,4 +1,4 @@
-import { Controller } from 'stimulus'
+import { Controller } from '@hotwired/stimulus'
 
 /**
  * Stimulus controller to toggle element visibility

diff --git a/app/helpers/spina/spina_helper.rb b/app/helpers/spina/spina_helper.rb
@@ -1,16 +1,13 @@
 module Spina::SpinaHelper
 
-  def spina_include_tags
+  def spina_importmap_tags
     safe_join [
-      javascript_include_tag("stimulus/libraries/es-module-shims", type: "module"),
-      tag.script(type: "importmap-shim", src: asset_path("spina/importmap.json")),
-      javascript_include_tag("stimulus/libraries/stimulus", type: "module-shim"),
-      javascript_include_tag("spina/libraries/trix")
+      javascript_inline_importmap_tag(Spina.config.importmap.paths),
+      javascript_importmap_shim_tag,
+      javascript_include_tag("spina/libraries/trix"),
+      javascript_import_module_tag("application")
     ], "\n"
   end
 
-  def autoloader_include_tag
-    javascript_include_tag("stimulus/loaders/autoloader", type: "module-shim")
-  end
 
 end
diff --git a/app/views/layouts/spina/admin/application.html.erb b/app/views/layouts/spina/admin/application.html.erb
@@ -10,19 +10,15 @@
 
     <title>Spina CMS</title>
 
-    <!-- Tailwind -->    
+    <!-- Tailwind -->
     <%= stylesheet_link_tag 'spina/application', data: {turbolinks_track: true} %>
 
-    <!-- Turbo and Stimulus -->
-    <%= turbo_include_tags %>
-    <%= spina_include_tags %>
+    <!-- Spina's importmap -->
+    <%= spina_importmap_tags %>
 
     <!-- Plugins & Hooks -->
     <%= yield(:head) %>
     <%= render Spina::Hooks::HookComponent.new(partial: "head") %>
-
-    <!-- Stimulus Autoloader -->
-    <%= autoloader_include_tag %>
   </head>
 
   <body>

diff --git a/lib/spina.rb b/lib/spina.rb
@@ -1,4 +1,3 @@
-require 'spina/importmap_helper'
 require 'spina/engine'
 require 'spina/admin_sectionable'
 require 'spina/railtie'
@@ -21,6 +20,7 @@ module Spina
                   :api_path,
                   :authentication,
                   :backend_path, 
+                  :importmap,
                   :frontend_parent_controller,
                   :disable_frontend_routes,
                   :disable_decorator_load,
@@ -50,6 +50,10 @@ module Spina
   # - config.queues.page_updates
   self.queues = ActiveSupport::InheritableOptions.new
 
+  # An importmap specifically meant for Spina
+  self.importmap = ActiveSupport::OrderedOptions.new
+  self.importmap.paths = Importmap::Paths.new
+
   # Tailwind purging
   # Spina will by default purge all unused Tailwind classes by scanning
   # the files listed below. You probably don't want to override this in 

diff --git a/lib/spina/engine.rb b/lib/spina/engine.rb
@@ -1,4 +1,5 @@
 require 'sass-rails'
+require 'importmap-rails'
 require 'turbo-rails'
 require 'stimulus-rails'
 require 'ancestry'
@@ -37,11 +38,17 @@ class Engine < ::Rails::Engine
         Spina::Parts::Attachment
       )
     end
-
-    initializer "spina.helpers" do
-      Rails.application.config.assets.configure do |env|
-        env.context_class.class_eval { include Spina::ImportmapHelper }
+
+    initializer "spina.importmap" do
+      Spina.config.importmap.paths.tap do |paths|
+        # Stimulus & Turbo
+        paths.asset "@hotwired/stimulus", path: "stimulus"
+        paths.asset "@hotwired/stimulus-autoloader", path: "stimulus-autoloader"
+        paths.asset "@hotwired/turbo-rails", path: "turbo"
+
+        paths.assets_in Spina::Engine.root.join("app/assets/javascripts/spina"), append_base_path: true
       end
     end
+
   end
 end
Original file line number	Diff line number	Diff line change
Expand Up		@@ -6,3 +6,4 @@

		//= link spina/application.css

		//= link spina/application.js
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		import "@hotwired/turbo-rails"
		import "@hotwired/stimulus-autoloader"