From a08f4659b29c3b72b33e70770835a9e25532ab55 Mon Sep 17 00:00:00 2001
From: Konstantin Solovev <kostyasolovyov54@gmail.com>
Date: Thu, 22 Dec 2022 10:55:46 +0400
Subject: [PATCH] fix ENVs in the server code

---
 config/webpack.client.config.js |  2 --
 package.json                    |  4 ++--
 src/server/render.tsx           | 11 +++++++++--
 src/server/server.tsx           | 14 +++++++++++++-
 4 files changed, 24 insertions(+), 7 deletions(-)

diff --git a/config/webpack.client.config.js b/config/webpack.client.config.js
index f50cb8e..b689963 100644
--- a/config/webpack.client.config.js
+++ b/config/webpack.client.config.js
@@ -34,8 +34,6 @@ const basePlugins = [
     processOutput(assets) {
       const output = JSON.stringify(assets);
 
-      process.env.ASSETS_MAP_GENERAL = output;
-
       return output;
     },
   }),
diff --git a/package.json b/package.json
index 0ce5ca0..1b9a4c9 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "template-for-react-ts-ssr-hmr",
-  "version": "2.0.1",
-  "description": "Template for a project with React, TypeScript, SSR, HMR. The template implies the use of CSS Modules and Stylus.",
+  "version": "2.0.2",
+  "description": "Template for a project with React, TypeScript, Server-Side Rendering (SSR), Hot Module Replacing (HMR). The template implies the use of CSS Modules and Stylus.",
   "repository": {
     "type": "git",
     "url": "https://github.com/Kallenju/template-for-react-ts-ssr-hmr.git"
diff --git a/src/server/render.tsx b/src/server/render.tsx
index 57f95f4..747e93c 100644
--- a/src/server/render.tsx
+++ b/src/server/render.tsx
@@ -8,8 +8,9 @@ dotenv.config({
   path: path.resolve(__dirname, `../.env.${process.env.DOTENV}`),
 });
 
-const { SSR_ABORT_DELAY = 10000, ASSETS_MAP_GENERAL } = process.env;
+const { NODE_ENV = 'production', SSR_ABORT_DELAY = 10000 } = process.env;
 
+import fs from 'fs';
 import { Response } from 'express';
 import React, { StrictMode } from 'react';
 import { renderToPipeableStream } from 'react-dom/server';
@@ -17,9 +18,15 @@ import AssetsMap from '../shared/interfaces/AssetsMap';
 import App from '../App';
 
 const isCrawler = false;
+const pathToAssetsMap = path.resolve(
+  __dirname,
+  NODE_ENV === 'production' ? '../assetsMap.json' : '../../dist/assetsMap.json'
+);
 
 export default function render(url: string, response: Response): void {
-  const __ASSETS_MAP: AssetsMap = JSON.parse(ASSETS_MAP_GENERAL).main;
+  const __ASSETS_MAP: AssetsMap = JSON.parse(
+    fs.readFileSync(pathToAssetsMap, 'utf8')
+  ).main;
 
   let didError = false;
   const stream: ReturnType<typeof renderToPipeableStream> =
diff --git a/src/server/server.tsx b/src/server/server.tsx
index bff91b4..6b4d3ca 100644
--- a/src/server/server.tsx
+++ b/src/server/server.tsx
@@ -1,3 +1,15 @@
+import path from 'path';
+import url from 'url';
+import dotenv from 'dotenv';
+
+const __dirname: string = path.dirname(url.fileURLToPath(import.meta.url));
+
+dotenv.config({
+  path: path.resolve(__dirname, `../.env.${process.env.DOTENV}`),
+});
+
+const { DEV_SERVER_PORT = 3000 } = process.env;
+
 import express, { Request, Response } from 'express';
 import compress from 'compression';
 import render from './render';
@@ -11,4 +23,4 @@ app.get('/', (request: Request, response: Response) =>
 
 app.use('/static', express.static('./dist/client'));
 
-app.listen(3000);
+app.listen(Number(DEV_SERVER_PORT));