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

ditch webpacker in favor of jsbundling/esbuild #2594

Merged
merged 44 commits into from
Jun 6, 2022

Conversation

colinxfleming
Copy link
Member

@colinxfleming colinxfleming commented May 28, 2022

I rule and have completed some work on Case Manager that's ready for review!

Since webpacker 5 is no longer compatible with rails 7 on heroku, it's time to rip the bandaid off. Webpacker has unfortunately been rather a mess for us since we moved onto it, and so for better or worse we're going toward the new approach, jsbundling.

Roughly the way jsbundling works is that it runs yarn build --watch as part of rails server, kinda like how webpacker ran something similar. But it's much more railsy in that it makes a lot of assumptions about how your project is laid out and what you're trying to do, most importantly including js transpilation.

Because the webpack move (several years ago now!) was so rough there were still a few things in sprockets, including (most egregiously) dupe copies of bootstrap, jquery, jquery-ui, and some coffeescript that never got converted cleanly. Pleased to say this PR resolves all of those duplicate resources.

As @xmunoz noted this PR is an unreviewable mess. It's not fair to ask anyone to review 67 files straight up. I think we need to take this on the faith of our test suite that this works okay, and declare a new beginning.

There are a few followup things we need to do that I'll make issues for:

  • get docker working again
  • update the readme to reflect that the new 'run server' command is bin/dev when running bare metal
  • restore proper CSP behavior

This pull request makes the following changes:

  • tears out webpacker in favor of jsbundling/cssbundling
  • kills every webpacker artifact I could find
  • consolidates everything to ES6

no view changes

It relates to the following issue #s:

For reviewer:

  • Adjust the title to explain what it does for the notification email to the listserv.
  • Tag this PR:
    • feature if it contains a feature, fix, or similar. This is anything that contains a user-facing fix in some way, such as frontend changes, alterations to backend behavior, or bug fixes.
    • dependencies if it contains library upgrades or similar. This is anything that upgrades any dependency, such as a Gemfile update or npm package upgrade.
  • If it contains neither, no need to tag this PR.

…w up right again, then completely nuke webpacker
Copy link
Member Author

@colinxfleming colinxfleming left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

notes at this stage

@@ -113,3 +113,6 @@ config/initializers/secret_token.rb
yarn-debug.log*
.yarn-integrity
yarn-error.log

/app/assets/builds/*
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

result of rails:javascript:install

@@ -0,0 +1,3 @@
web: bin/rails server -p 3000
Copy link
Member Author

@colinxfleming colinxfleming Jun 2, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Generated by rails:javascript:install; this is what bin/dev executes in three different processes

@@ -1,4 +1,3 @@
//= link_tree ../images
//= link_directory ../javascripts .js
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since these are now handled by cssbuild/jsbuild, they're packed up by those process and we don't need to include them in the manifest any longer. Sprockets still packs them up and delivers them though.

@@ -0,0 +1,46 @@
// Autosave on patient forms.
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Converted these to es6 finally.

@@ -0,0 +1,4366 @@
// NOTE: This was generated from https://jqueryui.com/download
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we didn't vendor this the imports work really weird.

@colinxfleming colinxfleming changed the title WIP jsbundling, but more restrained ditch webpacker in favor of jsbundling/esbundling Jun 4, 2022
Copy link
Member Author

@colinxfleming colinxfleming left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

notes

@@ -0,0 +1,25 @@
// Major library config
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is basically a recreation of application.scss in webpacker, but also resolves the awful split we had between sprockets and npm.

@@ -72,7 +72,6 @@ def update
else
error = @patient.errors.full_messages.to_sentence
flash.now[:alert] = error
response.status = :not_acceptable
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this (and the few similar changes) are, I think, because UJS had an update such that it doesn't fire templates on 4XX response codes. So we (unfortunately) treat failures to save as 200s now. it is horrible but we aren't interacting with this through, like, a json api so I think it's okay. I promise I feel an appropriate amount of bad aboutit.

class: [fontawesome_kit, "fa-#{event.icon}", 'event-item']),
entry_text(event)
], ' '
def fontawesome_classes(event)
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

no idea why this broke, but 🤷 more of this logic is in the view file now.

@@ -1,4 +1,5 @@
// For making bootstrap utilities available.
@import 'bootstrap/scss/bootstrap';
// @import "rails_bootstrap_forms";
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Intentionally leaving this commented out right now. Eventually we'll be able to import it more cleanly but for right now it doesn't seem to make that much of a difference, either in terms of display or interaction.

@xmunoz
Copy link
Member

xmunoz commented Jun 5, 2022

Did a quick pass through, seems legit but honestly a PR with this many changes is hard to review. I would appreciate some documentation about this somewhere, ideally in this PR, but if not here then in a follow-up. This would be relevant for me personally, to get #2580 review-able and merge-able.

@colinxfleming colinxfleming merged commit 37e0d3d into main Jun 6, 2022
@colinxfleming colinxfleming deleted the colin/jsbuild-better branch June 6, 2022 05:00
@lomky lomky changed the title ditch webpacker in favor of jsbundling/esbundling ditch webpacker in favor of jsbundling/esbuild Jun 23, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

jsbuild heroku deploys broken again :/ Webpacker is deprecated, remove it from our stack
2 participants