Is it possible to make this work without npm but with importmap

[troptropcontent]

Hello :)

I am pretty new to javascript, i have a rails 7 that does not have npm or yarn installed and that is for now only using importmaps.

I would like to use the primer CSS to support the view components.

Is it possible to have primer/css without npm, only using importmaps ?

Thank you so much for your help,
Tom

[camertron]

Hey @troptropcontent, interesting question! I have personally never used import maps before, but after reading a bit about them I think primer/view-components should work with them. Try putting something like this in config/importmap.rb:

pin "@primer/view-components", to: "https://ga.jspm.io/npm:@primer/[email protected]/app/assets/javascripts/primer_view_components.js"

As for the CSS from primer/view-components and primer/css, you should be able to pull them in directly using <link> tags:

<link rel="stylesheet" href="https://unpkg.com/@primer/[email protected]/app/assets/styles/primer_view_components.css" crossorigin="" />
<link rel="stylesheet" href="https://unpkg.com/@primer/[email protected]/dist/primer.css" crossorigin="" />

[troptropcontent]

It worked perfectly 🙏

Thank you so much !!

One more question, i have a date input to setup, but i do not see a date_input in the form documentation 🙏

How would you do that ?

[camertron]

Awesome, glad it's working!

One more question, i have a date input to setup, but i do not see a date_input in the form documentation

Ah yeah, date inputs aren't currently supported by the forms framework. A member of our team was actually looking at adding one last week, not sure how much progress was made. I wrote up this gist as a guide for adding new input types, although it's not much to go on 😅 I have a message out to my my team member and will post here when I hear back. You're welcome to take a shot at it too if you like 👍

[troptropcontent]

I will definitely give it a try 🙏

(I think that the gist link you provide is not the good one, it redirects to here)

[camertron]

Woops, sorry about that! Just edited the post to include the right link 😅

[dereke]

I notice this in the guides - https://primer.style/product/getting-started/rails/#import-maps

Unfortunately at the time of this writing (June 2024), it is not possible to use primer_view_components with import maps. A number of primer_view_component's JavaScript dependencies attempt to import paths that the import map isn't expecting (eg. tab-container-element).

What is the state as of Aug 2025?

[camertron]

Hey there @dereke 👋

Unfortunately I am no longer with GitHub, but given my past experience working on this library and my knowledge of the dynamics of the Primer team, I am 99% sure nothing has changed with regard to using PVC with importmaps. That is to say, it is still not possible to use PVC with importmaps for the reason mentioned in the documentation.

One way to avoid the import issue might be to include individual compiled javascript files, one per component, to the build output. You could then pull in the components you actually need instead of the whole thing, and hopefully you only need components that don't attempt to import 3rd party modules. That's really just a band-aid though.