Add cosmetic improvements to the Webpacker guide #41165
Conversation
| @@ -22,9 +22,10 @@ Webpacker is a Rails wrapper around the [webpack](https://webpack.js.org) build | |||
|
|
|||
| ### What is webpack? | |||
|
|
|||
| The goal of webpack, or any front-end build system, is to allow you to write your front-end code in a way that is convenient for developers and then package that code in a way that is convenient for browsers. With webpack, you can manage JavaScript, CSS, and static assets like files or fonts. Webpack will allow you to write your code, reference other code in your application, transform your code, and combine your code into easily downloadable packs. | |||
| The goal of webpack, or any front-end build system, is to allow you to write your front-end code in a way that is convenient for developers and then package that code in a way that is convenient for browsers. With webpack, you can manage JavaScript, CSS, and static assets like images or fonts. Webpack will allow you to write your code, reference other code in your application, transform your code, and combine your code into easily downloadable packs. | |||
There was a problem hiding this comment.
I thought "image" would be a more practical example of a "static asset", compared to "file".
| @@ -137,7 +139,7 @@ If you are using a CSS framework, you can add it to Webpacker by following the i | |||
| ### Using Webpacker for Static Assets | |||
|
|
|||
| The default Webpacker [configuration](https://github.com/rails/webpacker/blob/master/lib/install/config/webpacker.yml#L21) should work out of the box for static assets. | |||
| The configuration includes several image and font file format extensions, allowing Webpack to include them in the generated `manifest.json` file. | |||
| The configuration includes several image and font file format extensions, allowing webpack to include them in the generated `manifest.json` file. | |||
There was a problem hiding this comment.
"webpack" is spelled without a capital everywhere else in this doc.
There was a problem hiding this comment.
I see mostly capitalized usages outside of commands in the current doc. Please revert this change and let's capitalize it everywhere where it isn't a command (like we do with Active Record).
There was a problem hiding this comment.
I'd like to clarify: "Webpacker" is indeed capitalized everywhere in this doc, but I had the impression webpack's official spelling does not take a capital letter, and all instances of the word in this file, except one, followed that.
Even in its official documentation, as the first word of a sentence, it is not capitalized.
There was a problem hiding this comment.
🤦 I read this as webpacker the first time. My mistake, this makes sense, thanks for clarifying 😄
| @@ -177,18 +179,15 @@ As of Webpacker version 5, Webpacker is not "engine-aware," which means Webpacke | |||
|
|
|||
| Gem authors of Rails engines who wish to support consumers using Webpacker are encouraged to distribute frontend assets as an NPM package in addition to the gem itself and provide instructions (or an installer) to demonstrate how host apps should integrate. A good example of this approach is [Alchemy CMS](https://github.com/AlchemyCMS/alchemy_cms). | |||
|
|
|||
| ### Hot module replacement | |||
| ### Hot Module Replacement (HMR) | |||
There was a problem hiding this comment.
The mention of HMR below confused me at first, so I thought this may clarify it.
|
|
||
| Don't forget to disable HMR if you are not running webpack-dev-server otherwise you will get not found error for stylesheets. | ||
| Don't forget to disable HMR if you are not running webpack-dev-server otherwise you will get "not found error" for stylesheets. |
There was a problem hiding this comment.
Not sure where the quotes go here. Possibly:
| Don't forget to disable HMR if you are not running webpack-dev-server otherwise you will get "not found error" for stylesheets. | |
| Don't forget to disable HMR if you are not running webpack-dev-server otherwise you will get "not found" errors for stylesheets. |
|
There are conflicts on that file. Can you please rebase? |
- fix typos like double spaces, accidental caps - improve some HTML links by giving them a label - etc
davidstosik
force-pushed
the
webpacker-nitpicks
branch
from
735b66b
to
31ad146
Compare
|
@rafaelfranca Done! |
What
Small changes to the Webpacker guide, mainly to improve readability.
Why
I was reviewing #40817 but somehow dropped my review unfinished, and found some suggestions recently that I thought would be worth pushing.
Anything else?
@rossta did a great job documenting Webpacker, and I would like to thank him for it.
This was a great read and it clarified the blurry vision I had of Webpacker.
This PR only provides minor cosmetic changes that I didn't want to get lost in an unfinished PR review.
I'll provide a few in-line comments where deemed useful.
Sorry for the misleading tags! 🙇🏻♂️ I used GitHub's
hubto submit my pull-request, and it looks like it defaulted to themasterbranch, introducing (a lot!) more changes in the diff than was planned.