Comments (9)
dacook
commented on June 28, 2024
21
It seems really weird to me that the importmap solution doesn't cover css. It's like it only does half the job and leaves you to wonder about the rest (a google search shows lots of people scratching their heads and generally reverting to bundling).
When trying to migrate to import maps, the first thing I expected to see is extra options like this:
pin "tom-select", to: "https://ga.jspm.io/npm:[email protected]", preload: true,
javascript: "/dist/js/tom-select.complete.js",
css: "/dist/css/tom-select.css"(but I probably haven't figured out how this all works yet)
from importmap-rails.
dhh
commented on June 28, 2024
11
Yeah, you'll have to do this by hand. We don't have an API that could figure out what assets might be needed in addition to the main JS file. There may well be more than one. There may well be images. I don't see a path of us programmatically figuring this out.
from importmap-rails.
dacook
commented on June 28, 2024
1
I'm rendering it at the foot of <body>, although it could/should probably be placed elsewhere.
This partial is rendered on all pages in my application (which is ok because it's used on most).
from importmap-rails.
buncis
commented on June 28, 2024
to do it manually meaning is to do these steps
- download the css file manually
- put it on your
vendordirectory - then require the file to your
app/assets/stylesheets/application.css
from importmap-rails.
jclusso
commented on June 28, 2024
@dacook ironically running into the same exact thing. what did you settle on?
from importmap-rails.
dacook
commented on June 28, 2024
I wasn't able to find a solution, so for the interim I've just been using HTML tags directly in a partial:
<!-- Load tom-select from CDN -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/tom-select.complete.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/tom-select.min.css" rel="stylesheet">To me, this seems superior because the package config is all in one place (name, version and entry point).
from importmap-rails.
buncis
commented on June 28, 2024
did you render the partial on <head> or <body>?
from importmap-rails.
buncis
commented on June 28, 2024
I press enter when all my typing is not inputted (wireless keyboard on linux XD)
have updated it
oh it is because html safe from github maybe
from importmap-rails.
dacook
commented on June 28, 2024
Thanks, I've updated my answer too, to help keep commit history concise.
from importmap-rails.
Related Issues (20)
- files ending in `_index.js` have `index` replaced with an empty string HOT 3
- Why do certain pins disappear in production? HOT 2
- Unpin command causing net error HOT 3
- Confusing message on 'update'
- Unable to unpin HOT 1
- Persistent 404 error when pinning HOT 11
- Package works when pinned from JSPM but not when downloaded HOT 2
- Break in iOS 16.2 when upgrading from 1.2.3 to 2.0.1 HOT 4
- turbo:load event not fired anymore in test environment after upgrade from 1.2.3 to 2.0.1 HOT 3
- Feature suggestion: optional `process.env` polyfill
- Multiple importmaps HOT 6
- Importmap update removes pins via http HOT 1
- importmap pin/update removes preload: false
- ga.jspm.io never updates HOT 3
- ./bin/importmap outdated command fails with undefined method `dig' for an instance of String HOT 6
- Add option to `bin/importmap pin URL` to create direct/remote link without downloading
- Option to 're-sync' vendor folder HOT 2
- How to add jquery in importmaps rails 7 HOT 2
- `update` does not update a package even when `outdated` shows the new version HOT 1
- Some file are missing / Not included HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from importmap-rails.