Is it possible to use flyonui with importmap-rails?

rubyonrails-talk
1

Hey!

I already read Importmap or jsbundling? I use both, How does importmaps-rails replace yarn correctly in rails 8? and Download all the files associated with a package from a CDN by Caleb-T-Owens · Pull Request #235 · rails/importmap-rails · GitHub.

I was able to make it work by adding nodejs to my project with asdf and installing it as stated on Quick Start - FlyonUI

Installed it with:

npm install flyonui

Changed my tailwind.config.js to include the following:

module.exports = { 
  content: ["./node_modules/flyonui/dist/js/*.js"], // Require only if you want to use FlyonUI JS component (yes, I want!)

  plugins: [
    require("flyonui"),
    require("flyonui/plugin") // Require only if you want to use FlyonUI JS component (yes, I want!)
  ]
}

I also need to include the file node_modules/flyonui/flyonui.js in my HTML. For now, I just copied it to the public folder and referenced it with a script tag: <script src="flyonui.js"></script>.

It feels very hackish to me. I would love to hear suggestions on how I can improve this.

I also don’t understand how the content and plugins’ contents are processed in the background by tailwindcss. I think the content is just to determine what classes it must include in the final CSS bundle, and the require statements in plugins have some conventions to load the files from the node_modules.

Best regards!