Sprockets 4 and Webpacker Config/Wiki

[niedfelj]

• What were you trying to do?

Install administrate with webpacker/sprockets 4 using the wiki

• What did you end up with (logs, or, even better, example apps are great!)?

And error message about variables not being defined and about assets not being precompiled

• What versions are you running?
  • Rails 6.0.3.4
  • administrate 0.14.0

It seems that the latest rails uses sass-rails 6 and sprockets 4 which creates a few issues for the current wiki instructions and webpacker.

1. It seems the previous config/manifest.js had a line like this:

//= link_directory ../stylesheets .css

When generating the assets from administrate to modify for the webpacker js changes, it will compile all of the .css under stylesheets out of order and throw errors about things like base/form not having variables defined.

More details here rails/sprockets#597

2. The fix for above is to change that line to just //= link application.css, but application.css by default has this line, which ultimately causes the same problem.

*= require_tree .

In the end I got it working by having this in my manifest.js:

//= link_tree ../images
//= link application.css
//= link administrate/application.css

And removing the require_tree . from application.css

[springwq]

Thank you @niedfelj

Your solution saves me tons of time to figure out the below issue when I am deploying to production.

ActionView::Template::Error (The asset "administrate/application.css" is not present in the asset pipeline

[nickcharlton]

Thanks for finding this out! Do you think you'd be able to update the wiki entry with your findings?

Unfortunately, until we have a better solution that's our best approach so far.

[tannerwelsh]

I am running into a similar issue (getting Sprockets::rails::Helper::AssetNotPrecompiled errors) and found the solution above to work.

In my debugging research I also ran across this section from the Rails Guides on Getting Started with Engines > 6.5 Separate Assets & Precompiling: when dealing with situations "where your engine's assets are not required by the host application",

you should explicitly define these assets for precompilation. This tells Sprockets to add your engine assets when rails assets:precompile is triggered.

You can define assets for precompilation in engine.rb:

initializer "blorgh.assets.precompile" do |app|
  app.config.assets.precompile += %w( admin.js admin.css )
end

Applying this change to the local version of my administrate gem fixed the problem:

module Administrate
  class Engine < ::Rails::Engine
    isolate_namespace Administrate

    initializer "administrate.assets.precompile" do |app|
      app.config.assets.precompile += %w( administrate/application.js administrate/application.css )
    end
    
    # ...

This seemed like a cleaner solution than requiring all end users to add //= link administrate/application.(css|js) to their application manifest.js.

I'm not very well versed with the details of Sprockets, so not sure what side effects the above code might have which would affect users with other setups.