PR-492498: changing some webpack configuration and updating packages.

src/frontend/index.tsx

@@ -6,7 +6,7 @@ import { BrowserRouter as Router } from 'react-router-dom';
 import { Provider } from 'react-redux';
 import { IInitialState } from './reducers/index';
 import setStore from './setStore';
-import config from '../../config';
+import { config } from '../../config';
 
 import './styles/global.scss';
 import App from './components/App';
@@ -28,7 +28,7 @@ interface IHot {
 	accept: any
 }
 
-const { env } = config;
+const { ENV } = config;
 
 const preloadedState = window.__PRELOADED_STATE__;
 const store = setStore({ initialState: preloadedState });
@@ -37,7 +37,7 @@ delete window.__PRELOADED_STATE__;
 
 const container = document.getElementById('app')!;
 
-if(env === 'development') {
+if(ENV === 'development') {
 	const root = createRoot(container);
 	root.render(
 		<Provider store={store}>
@@ -49,7 +49,7 @@ if(env === 'development') {
 }
 
 // add "const root" to be able to rerender.
-env === 'production' && hydrateRoot(container,
+ENV === 'production' && hydrateRoot(container,
 	<Provider store={store}>
 		<Router>
 			<App />
@@ -72,7 +72,7 @@ env === 'production' && hydrateRoot(container,
     </Provider>
 ); */
 
-if((env) && (env === 'production')){
+if((ENV) && (ENV === 'production')){
 	serviceWorkerRegistration();
 }
 

src/frontend/setStore.ts

@@ -2,18 +2,18 @@
 import { legacy_createStore as createStore} from 'redux'; //, applyMiddleware
 // import { Provider } from 'react-redux';
 import { composeWithDevTools as composeWithDevToolsWeb } from 'redux-devtools-extension';
-import config from '../../config';
+import { config } from '../../config';
 import reducer, { IInitialState } from './reducers';
 
 
-const { env } = config;
+const { ENV } = config;
 
 const composeEnhancers = composeWithDevToolsWeb({
 	// Specify here name, actionsBlacklist, actionsCreators and other options
 });
 
 const setStore = ({ initialState }: { initialState: IInitialState | undefined }) => {
-	const store = env === 'development' ? createStore(
+	const store = ENV === 'development' ? createStore(
 		reducer,
 		initialState,
 		composeEnhancers(),

src/server/server.tsx

@@ -2,7 +2,7 @@
 import express from 'express';
 import webpack from 'webpack';
 import helmet from 'helmet';
-import config from '../../config';
+import { config } from '../../config';
 
 //Dependencies of HotReloading
 import webpackConfig from '../../webpack.config.dev';
@@ -24,7 +24,7 @@ import { getHashManifest, haveVendorsCss } from './utilsServer';
 //App
 import App from '../frontend/components/App';
 
-const { env, port } = config;
+const { ENV, PORT } = config;
 
 const routesUrls = routes.map( route => route.path);
 
@@ -32,7 +32,7 @@ const app = express();
 
 // @ts-ignore:next-line
 const compiler = webpack(webpackConfig);
-if(env === 'development'){
+if(ENV === 'development'){
 	const serverConfig = { 
 		serverSideRender: true,
 		publicPath: webpackConfig.output?.publicPath,
@@ -122,6 +122,6 @@ app
 	.get('*', renderApp);
 
 
-app.listen(port, () => {
-	console.log(`Server running on port ${port}`);
+app.listen(PORT, () => {
+	console.log(`Server running on port ${PORT}`);
 });

src/server/utilsServer.ts

@@ -1,7 +1,7 @@
 import fs from 'fs';
-import config from '../../config';
+import { config } from '../../config';
 
-const { env } = config
+const { ENV } = config;
 
 export const getHashManifest = () => {
 	try {
@@ -18,8 +18,8 @@ export const haveVendorsCss = (manifest, memoryFs) => {
 	try {
 		const baseUrl = __dirname.replace(/\/server(.*)/,'');
 		const fullURL = `${baseUrl}${manifest ? manifest['vendors.css'] : '/build/assets/vendors.css'}`;
-		env === 'production' && fs.readFileSync(fullURL).toString();
-		env === 'development' && memoryFs.readFileSync(fullURL).toString();
+		ENV === 'production' && fs.readFileSync(fullURL).toString();
+		ENV === 'development' && memoryFs.readFileSync(fullURL).toString();
 		return true
 	}catch(err){
 		// console.error(err);