Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[ImportMaps] Manage JavaScript dependencies without a JS toolchain #48371

Open
wants to merge 1 commit into
base: 6.3
Choose a base branch
from
Open

[ImportMaps] Manage JavaScript dependencies without a JS toolchain #48371

wants to merge 1 commit into from
+707 −0

Conversation

dunglas
Copy link
Member

@dunglas dunglas commented Nov 28, 2022 •
edited

Q A
Branch? 6.3
Bug fix? no
New feature? yes
Deprecations? no
Tickets Fix #48349
License MIT
Doc PR todo

Yarn, NPM, pnpm, Babel, SWC, Webpack, Rollup, Parcel... Is it really necessary to introduce so much complexity to create a beautiful and interactive website?

The Symfony UX initiative greatly simplified how to build frontend applications with Symfony by going back to the roots: server-side generated HTML (goodbye JSX, our good old Twig is back), and minimalist JavaScript thanks to Hotwire. However, to use Symfony UX, you still need to install, set up, and maintain a full JS toolchain... which is no picnic.

Is it still really necessary?! Browers recently gained features making it possible to do without most of them. Let's get rid of the complexity by using the web platform thanks to this new component!

The ImportMaps component is very similar to importmap-rails, but has command names similar to Composer.

Usage

Add or update packages:

bin/console importmap:require '@hotwired/stimulus'

Remove packages:

bin/console importmap:remove  '@hotwired/stimulus'

Update all packages to their latest versions:

bin/console importmap:update

Make the packages available in your app:

<!doctype html>
<head>
    {{ importmap() }}
    <script src="/js/application.js" type="module"></script>
</head>
{# ... #}

TODO

  • Add tests
  • Do not hardcore the URL of the polyfill
  • Support downloading the JS files locally instead of using the CDN
  • Update Symfony UX to support Import Maps in addition to Webpack Encore

@dunglas dunglas requested a review from yceruto as a code owner Nov 28, 2022
@carsonbot carsonbot added this to the 6.3 milestone Nov 28, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@yceruto yceruto

Assignees
No one assigned
Labels
Feature Status: Needs Review
Projects
None yet
Milestone
6.3
Development

Successfully merging this pull request may close these issues.

Provide integration with importmaps
2 participants
@dunglas @carsonbot