Describe keys different from webpack-dev-server in generated webpacke…

…r.yml (shakacode#201) Co-authored-by: Alexey Romanov <[email protected]> Co-authored-by: Justin Gordon <[email protected]>
willemorvets · Dec 2, 2022 · 1b7c050 · 1b7c050
1 parent fc900f0
commit 1b7c050
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 7 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -9,6 +9,7 @@ Changes since last non-beta release.
 _Please add entries here for your pull requests that are not yet released._
 
 ### Improved
+- Describe keys different from `webpack-dev-server` in generated `webpacker.yml`. [PR 194](https://github.com/shakacode/shakapacker/pull/194) by [alexeyr](https://github.com/alexeyr).
 - Allow webpack-cli v5 [PR 216](https://github.com/shakacode/shakapacker/pull/216) by [tagliala](https://github.com/tagliala).
 
 ## [v6.5.4] - November 4, 2022

diff --git a/lib/install/config/webpacker.yml b/lib/install/config/webpacker.yml
@@ -49,11 +49,13 @@ development:
   compiler_strategy: mtime
 
   # Reference: https://webpack.js.org/configuration/dev-server/
+  # Keys not described there are documented inline and in https://github.com/shakacode/shakapacker/
   dev_server:
     https: false
     host: localhost
     port: 3035
     # Hot Module Replacement updates modules while the application is running without a full reload
+    # Used instead of the `hot` key in https://webpack.js.org/configuration/dev-server/#devserverhot
     hmr: false
     # If HMR is on, CSS will by inlined by delivering it as part of the script payload via style-loader. Be sure
     # that you add style-loader to your project dependencies.
@@ -70,13 +72,14 @@ development:
       overlay: true
       # May also be a string
       # webSocketURL:
-      #  hostname: "0.0.0.0"
-      #  pathname: "/ws"
+      #  hostname: '0.0.0.0'
+      #  pathname: '/ws'
       #  port: 8080
     # Should we use gzip compression?
     compress: true
     # Note that apps that do not check the host are vulnerable to DNS rebinding attacks
-    allowed_hosts: "all"
+    allowed_hosts: 'all'
+    # Shows progress and colorizes output of bin/webpacker[-dev-server]
     pretty: true
     headers:
       'Access-Control-Allow-Origin': '*'

diff --git a/test/mounted_app/test/dummy/config/webpacker.yml b/test/mounted_app/test/dummy/config/webpacker.yml
@@ -41,8 +41,14 @@ development:
     port: 3035
     public: localhost:3035
     hmr: false
-    # Inline should be set to true if using HMR
-    inline: true
+    # If HMR is on, CSS will by inlined by delivering it as part of the script payload via style-loader. Be sure
+    # that you add style-loader to your project dependencies.
+    #
+    # If you want to instead deliver CSS via <link> with the mini-extract-css-plugin, set inline_css to false.
+    # In that case, style-loader is not needed as a dependency.
+    #
+    # mini-extract-css-plugin is a required dependency in both cases.
+    inline_css: true
     overlay: true
     disable_host_check: true
     use_local_ip: false

diff --git a/test/test_app/config/webpacker_other_location.yml b/test/test_app/config/webpacker_other_location.yml
@@ -43,8 +43,14 @@ development:
     port: 3035
     public: localhost:3035
     hmr: false
-    # Inline should be set to true if using HMR
-    inline: true
+    # If HMR is on, CSS will by inlined by delivering it as part of the script payload via style-loader. Be sure
+    # that you add style-loader to your project dependencies.
+    #
+    # If you want to instead deliver CSS via <link> with the mini-extract-css-plugin, set inline_css to false.
+    # In that case, style-loader is not needed as a dependency.
+    #
+    # mini-extract-css-plugin is a required dependency in both cases.
+    inline_css: true
     overlay: true
     disable_host_check: true
     use_local_ip: false