Use CSS and JS bundling for assets #413
Closed
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This was left over from a previous upgrade
This is now an optional dependency
This adds the following: - An app/assets/builds folder - This will contain built JS, which will then be served via the asset pipeline - Add app/javascript/application.js file - This is the entrypoint for all frontend Javascript - A bin/dev file - This should be how to run the application in development. It runs (and optionally installs) Foreman, to run the server and build Javsacript on the fly - A Procfile.dev file - This tells Foreman what processes to run when running the bin/dev script - A rollup.config.js file - This tells Rollup how to build the Javascript in the application.js
This has required us to install Yarn in the base layer, so we can run yarn in the main layer and watch the JS for changes
This allows us to support older browsers (down to and including IE11)
This allows us to `import` separate JS components and have them all run when the JS is invoked (i.e. on pageload)
As well as gems that we no longer use
Turbolinks is deprecated now, so let’s use [Turbo](https://github.com/hotwired/turbo) instead
This does the following: - Installs the `sass` node library - Adds a `build:css` command to build css via node - Adds the `build:css` command to the Procfile - Removes the `stylesheets` dir from manifest.js
pezholio
force-pushed
the
use-css-and-js-bundling-for-assets
branch
from
7a7f7e3 to
e2f0967
Compare
|
I don't have a strong opinion yet but I think we should talk about the choice of Rollup over importmaps, as I think it is a choice? As I understand it importmaps don't require Seems like we can get packages like the govuk-frontend by using their "designed to be used with JavaScript CDNs for your npm package dependencies" with pinning. |
|
Given this PRs age and that the required #412 has been closed, I am going to close this as well. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Webpacker is now no longer in active development, so I've added support for cssbundling-rails with sass and jsbundling-rails with Rollup.js.
Now asset dependencies (css / js libraries etc) are all handled by Yarn, and the building of assets is handled by Yarn scripts, rather than magically happening via the asset pipeline. This keeps concerns nicely seperated and gives us much more control over how assets are processed and built.
There is also a
bin/devfile which watches assets for changes via Foreman when the server is spun up.This is draft until #412 is in.