[nextjs][RAV] avoid unexpected linebreaks when generating config (#1791)

* [nextjs][RAV] avoid unexpected linebreaks when generating config

CHANGELOG.md

@@ -13,7 +13,7 @@ Our versioning strategy is as follows:
 
 ### 🐛 Bug Fixes
 
-* `[templates/nextjs]` `[templates/react]` `[templates/vue]` `[templates/angular]` Changed formatting in temp/config to prevent parse issues in Unix systems ([#1787](https://github.com/Sitecore/jss/pull/1787))
+* `[templates/nextjs]` `[templates/react]` `[templates/vue]` `[templates/angular]` Changed formatting in temp/config to prevent parse issues in Unix systems ([#1787](https://github.com/Sitecore/jss/pull/1787) [#1791](https://github.com/Sitecore/jss/pull/1791))
 
 ### 🎉 New Features & Improvements
 

docs/upgrades/unreleased.md

@@ -3,40 +3,40 @@
 # react
 
 * Replace `scripts/generate-config.js` if you have not modified it. Otherwise:
-    * Replace comma before a newline (`,`) with semicolon (`;`) in configText prop assignment so it would look like this:
+    * Add a `trim()` call to `config[prop]` and replace comma before a newline (`,`) with semicolon (`;`) in configText prop assignment so it would look like this:
 
         ```
             configText += `config.${prop} = process.env.REACT_APP_${constantCase(prop)} || "${
-                config[prop]
+                config[prop]?.trim()
             }";\n`;
         ```
 
 # angular
 
 * Replace `scripts/generate-config.ts` if you have not modified it. Otherwise:
-    * Replace comma before a newline (`,`) with semicolon (`;`) in configText prop assignment so it would look like this:
+    * Add a `trim()` call to `config[prop]` (use toString() to avoid type conflicts) and replace commas before a newline (`,`) with semicolon (`;`) in configText prop assignments so it would look like this:
 
         ```
-            configText += `config.${prop} = process.env.${constantCase(prop)} || "${config[prop]}";\n`;
+            configText += `config.${prop} = process.env.${constantCase(prop)} || "${config[prop]?.toString().trim()}";\n`;
         ```
 
 
 # vue
 
 * Replace `scripts/generate-config.js` if you have not modified it. Otherwise:
-    * Replace comma before a newline (`,`) with semicolon (`;`) in configText prop assignment so it would look like this:
+    *  Add a `trim()` call to `config[prop]` and replace commas before a newline (`,`) with semicolon (`;`) in configText prop assignments so it would look like this:
 
         ```
             configText += `config.${prop} = process.env.VUE_APP_${constantCase(prop)} || "${
-                config[prop]
+                config[prop]?.trim()
             }";\n`;
         ```
 
 # nextjs
 
 * Replace `scripts/generate-config.ts` if you have not modified it. Otherwise:
-    * Replace comma before a newline (`,`) with semicolon (`;`) in configText prop assignment so it would look like this:
+    * Add a `trim()` call to `config[prop]` and replace comma before a newline (`,`) with semicolon (`;`) in configText prop assignment so it would look like this:
         
         ```
-            configText += `config.${prop} = process.env.${constantCase(prop)} || '${config[prop]}';\n`;
+            configText += `config.${prop} = process.env.${constantCase(prop)} || '${config[prop]?.trim()}';\n`;
         ```

packages/create-sitecore-jss/src/templates/angular/scripts/generate-config.ts

@@ -50,12 +50,12 @@ const config = {};\n`;
 
   // Set base configuration values, allowing override with environment variables
   Object.keys(config).forEach((prop) => {
-    configText += `config.${prop} = process.env.${constantCase(prop)} || "${config[prop]}";\n`;
+    configText += `config.${prop} = process.env.${constantCase(prop)} || "${config[prop]?.toString().trim()}";\n`;
   });
   // Set computed values, allowing override with environment variables
   Object.keys(computedConfig).forEach((prop) => {
     configText += `config.${prop} = process.env.${constantCase(prop)} || ${
-      computedConfig[prop]
+      computedConfig[prop]?.toString().trim()
     };\n`;
   });
   configText += `module.exports.environment = config;`;

packages/create-sitecore-jss/src/templates/nextjs/scripts/generate-config.ts

@@ -53,7 +53,7 @@ const config = {};\n`;
 
   // Set configuration values, allowing override with environment variables
   Object.keys(config).forEach(prop => {
-    configText += `config.${prop} = process.env.${constantCase(prop)} || '${config[prop]}';\n`;
+    configText += `config.${prop} = process.env.${constantCase(prop)} || '${config[prop]?.trim()}';\n`;
   });
 
   configText += `module.exports = config;`;

packages/create-sitecore-jss/src/templates/react/scripts/generate-config.js

@@ -51,7 +51,7 @@ const config = {};\n`;
   // Set base configuration values, allowing override with environment variables
   Object.keys(config).forEach(prop => {
     configText += `config.${prop} = process.env.REACT_APP_${constantCase(prop)} || "${
-      config[prop]
+      config[prop]?.trim()
     }";\n`;
   });
   configText += 'module.exports = config;';

packages/create-sitecore-jss/src/templates/vue/scripts/generate-config.js

@@ -46,13 +46,13 @@ const config = {};\n`;
   // Set base configuration values, allowing override with environment variables
   Object.keys(config).forEach((prop) => {
     configText += `config.${prop} = process.env.VUE_APP_${constantCase(prop)} || "${
-      config[prop]
+      config[prop]?.trim()
     }";\n`;
   });
   // Set computed values, allowing override with environment variables
   Object.keys(computedConfig).forEach((prop) => {
     configText += `config.${prop} = process.env.VUE_APP_${constantCase(prop)} || ${
-      computedConfig[prop]
+      computedConfig[prop]?.trim()
     };\n`;
   });
   configText += 'module.exports = config;';