aleleba/create-react-ssr
1
0
Fork 0
mirror of https://github.com/aleleba/create-react-ssr.git synced 2025-04-19 14:18:06 -06:00
Code Issues Actions Packages Projects 1 Releases Wiki Activity

Compare commits

base: aleleba:f04553d033fd217d4032070d8768f57440ccbf70
Branches Tags
aleleba:master
..
compare: aleleba:d0f4f38381b7a64f83eb0a9cf5865ea11c2b9599
Branches Tags
aleleba:master

No commits in common. "f04553d033fd217d4032070d8768f57440ccbf70" and "d0f4f38381b7a64f83eb0a9cf5865ea11c2b9599" have entirely different histories.
f04553d033 ... d0f4f38381

25 changed files with 997 additions and 1504 deletions
Show Stats Expand all files Collapse all files

140
bin/cli.js
View File

@ -2,62 +2,62 @@
const { execSync } = require('child_process'); const { execSync } = require('child_process');
var fs = require('fs'); var fs = require('fs');
const isWin = process.platform === 'win32'; const isWin = process.platform === "win32";
const runCommand = command => { const runCommand = command => {
try{ try{
execSync(`${command}`, {stdio: 'inherit'}); execSync(`${command}`, {stdio: 'inherit'});
} catch (e) { } catch (e) {
console.error(`Failed to execute ${command}`, e); console.error(`Failed to execute ${command}`, e);
return false; return false;
} }
return true; return true;
}; }
const runCommandWithOutput = command => { const runCommandWithOutput = command => {
try{ try{
return execSync(`${command}`); return execSync(`${command}`);
} catch (e) { } catch (e) {
console.error(`Failed to execute ${command}`, e); console.error(`Failed to execute ${command}`, e);
return false; return false;
} }
}; }
const replaceTextOnFile = ({ const replaceTextOnFile = ({
file, file,
textToBeReplaced, textToBeReplaced,
textReplace, textReplace,
arrOfObjectsBeReplaced arrOfObjectsBeReplaced
}) => { }) => {
let data; let data
try{ try{
data = fs.readFileSync(file, 'utf8'); data = fs.readFileSync(file, 'utf8');
} catch (e) { } catch (e) {
console.error(`Failed to read file ${file}`, e); console.error(`Failed to read file ${file}`, e);
return false; return false;
} }
let result; let result
if(arrOfObjectsBeReplaced){ if(arrOfObjectsBeReplaced){
arrOfObjectsBeReplaced.forEach( obj => { arrOfObjectsBeReplaced.forEach( obj => {
if(result){ if(result){
result = result.replace(obj.textToBeReplaced, obj.textReplace).replace(/^\s*[\r\n]/gm, ' '); result = result.replace(obj.textToBeReplaced, obj.textReplace).replace(/^\s*[\r\n]/gm, ' ');
}else{ }else{
result = data.replace(obj.textToBeReplaced, obj.textReplace).replace(/^\s*[\r\n]/gm, ' '); result = data.replace(obj.textToBeReplaced, obj.textReplace).replace(/^\s*[\r\n]/gm, ' ');
} }
}); })
}else{ }else{
result = data.replace(textToBeReplaced, textReplace).replace(/^\s*[\r\n]/gm, ' '); result = data.replace(textToBeReplaced, textReplace).replace(/^\s*[\r\n]/gm, ' ');
} }
try{ try{
console.log('text changed'); console.log('text changed')
fs.writeFileSync(file, result, 'utf8'); fs.writeFileSync(file, result, 'utf8');
} catch (e) { } catch (e) {
console.error(`Failed to read file ${file}`, e); console.error(`Failed to read file ${file}`, e);
return false; return false;
} }
}; }
const repoName = process.argv[2]; const repoName = process.argv[2];
const gitCheckoutCommand = `git clone --depth 1 https://github.com/aleleba/create-react-ssr ${repoName}`; const gitCheckoutCommand = `git clone --depth 1 https://github.com/aleleba/create-react-ssr ${repoName}`;
@ -65,13 +65,13 @@ console.log(`Cloning the repository with name ${repoName}`);
const checkedOut = runCommand(gitCheckoutCommand); const checkedOut = runCommand(gitCheckoutCommand);
if(!checkedOut) process.exit(-1); if(!checkedOut) process.exit(-1);
const actualVersion = runCommandWithOutput(`cd ${repoName} && node -p "require('./package.json').version"`).toString().trim(); const actualVersion = runCommandWithOutput(`cd ${repoName} && node -p "require('./package.json').version"`).toString().trim()
const installDepsCommand = `cd ${repoName} && npm i`; const installDepsCommand = `cd ${repoName} && npm i`;
const cleanGitHistoryCommand = `cd ${repoName} && rm -rf .git && git init && git add --all -- ":!.github" ":!bin" && git commit -m "Initial commit"`; const cleanGitHistoryCommand = `cd ${repoName} && rm -rf .git && git init && git add --all -- ":!.github" ":!bin" && git commit -m "Initial commit"`
const cleanGitHistoryCommandWindows = `cd ${repoName} && rmdir .git /s /q && git init && git add --all -- ":!.github" ":!bin" && git commit -m "Initial commit"`; const cleanGitHistoryCommandWindows = `cd ${repoName} && rmdir .git /s /q && git init && git add --all -- ":!.github" ":!bin" && git commit -m "Initial commit"`
const deleteFoldersCommand = `cd ${repoName} && rm -rf .github && rm -rf bin`; const deleteFoldersCommand = `cd ${repoName} && rm -rf .github && rm -rf bin`
const deleteFoldersCommandWindows = `cd ${repoName} && rmdir .github /s /q && rmdir bin /s /q`; const deleteFoldersCommandWindows = `cd ${repoName} && rmdir .github /s /q && rmdir bin /s /q`
console.log(`Installing dependencies for ${repoName}`); console.log(`Installing dependencies for ${repoName}`);
const installedDeps = runCommand(installDepsCommand); const installedDeps = runCommand(installDepsCommand);
@ -79,31 +79,31 @@ if(!installedDeps) process.exit(-1);
console.log(`Replacing Json data for ${repoName}`); console.log(`Replacing Json data for ${repoName}`);
replaceTextOnFile({ replaceTextOnFile({
file: `./${repoName}/package.json`, file: `./${repoName}/package.json`,
arrOfObjectsBeReplaced: [ arrOfObjectsBeReplaced: [
{ {
textToBeReplaced: '"bin": "./bin/cli.js",', textToBeReplaced: `"bin": "./bin/cli.js",`,
textReplace: '' textReplace: ``
}, },
{ {
textToBeReplaced: `"version": "${actualVersion}",`, textToBeReplaced: `"version": "${actualVersion}",`,
textReplace: '"version": "0.0.1",' textReplace: `"version": "0.0.1",`
}, },
{ {
textToBeReplaced: '"name": "@aleleba/create-react-ssr",', textToBeReplaced: `"name": "@aleleba/create-react-ssr",`,
textReplace: `"name": "${repoName}",` textReplace: `"name": "${repoName}",`
} }
] ]
}); })
console.log(`Cleaning History of Git for ${repoName}`); console.log(`Cleaning History of Git for ${repoName}`);
const cleanGitHistory = isWin ? runCommand(cleanGitHistoryCommandWindows) : runCommand(cleanGitHistoryCommand); const cleanGitHistory = isWin ? runCommand(cleanGitHistoryCommandWindows) : runCommand(cleanGitHistoryCommand);
if(!cleanGitHistory) process.exit(-1); if(!cleanGitHistory) process.exit(-1);
console.log('Congratulations! You are ready. Follow the following commands to start'); console.log("Congratulations! You are ready. Follow the following commands to start");
console.log(`cd ${repoName}`); console.log(`cd ${repoName}`);
console.log('Create a .env file with ENV=development(defauld: production), PORT=3000 (default: 80), PUBLIC_URL=your_public_url(optional)(default: "auto"), PREFIX_URL=your_prefix_url(optional)(default: ""), ONLY_EXACT_PATH=true(optional)(default: false)'); console.log('Create a .env file with ENV=development(defauld: production), PORT=3000 (default: 80), PUBLIC_URL=your_public_url(optional)(default: "auto"), PREFIX_URL=your_prefix_url(optional)(default: ""), ONLY_EXACT_PATH=true(optional)(default: false)');
console.log('Then you can run: npm start:dev'); console.log(`Then you can run: npm start:dev`);
const deleteFolders = isWin ? runCommand(deleteFoldersCommandWindows) : runCommand(deleteFoldersCommand); const deleteFolders = isWin ? runCommand(deleteFoldersCommandWindows) : runCommand(deleteFoldersCommand);
if(!deleteFolders) process.exit(-1); if(!deleteFolders) process.exit(-1);

4
config/index.ts
View File

@ -4,7 +4,7 @@ export const deFaultValues = {
PUBLIC_URL: 'auto', PUBLIC_URL: 'auto',
PREFIX_URL: '', PREFIX_URL: '',
ONLY_EXACT_PATH: false, ONLY_EXACT_PATH: false,
}; }
export const config = { export const config = {
ENV: process.env.ENV ? process.env.ENV : deFaultValues.ENV, ENV: process.env.ENV ? process.env.ENV : deFaultValues.ENV,
@ -14,4 +14,4 @@ export const config = {
ONLY_EXACT_PATH: process.env.ONLY_EXACT_PATH ? process.env.ONLY_EXACT_PATH === 'true' : deFaultValues.ONLY_EXACT_PATH, ONLY_EXACT_PATH: process.env.ONLY_EXACT_PATH ? process.env.ONLY_EXACT_PATH === 'true' : deFaultValues.ONLY_EXACT_PATH,
}; };
export default config; export default config

14
cypress/e2e/App.test.ts
View File

@ -1,20 +1,20 @@
describe('Initial Component Tests', () => { describe('Initial Component Tests', () => {
it('Will show the Initial Component page.', () => { it('Will show the Initial Component page.', () => {
cy.visit('/'); cy.visit('/');
cy.get('a').contains('Other Component'); cy.get('a').contains('Other Component');
}); });
it('Will Redirect to Other Component page.', () => { it('Will Redirect to Other Component page.', () => {
cy.visit('/'); cy.visit('/');
cy.get('a').contains('Other Component').click(); cy.get('a').contains('Other Component').click();
cy.get('a').contains('Initial Component'); cy.get('a').contains('Initial Component');
}); });
it('Will show the Other Component page.', () => { it('Will show the Other Component page.', () => {
cy.visit('/other-component'); cy.visit('/other-component');
cy.get('a').contains('Initial Component'); cy.get('a').contains('Initial Component');
}); });
it('Will Redirect to Initial Component page.', () => { it('Will Redirect to Initial Component page.', () => {
cy.visit('/other-component'); cy.visit('/other-component');
cy.get('a').contains('Initial Component').click(); cy.get('a').contains('Initial Component').click();
cy.get('a').contains('Other Component'); cy.get('a').contains('Other Component');
}); });
}); });

2
cypress/support/commands.ts
View File

@ -34,4 +34,4 @@
// visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element> // visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
// } // }
// } // }
// } // }

2
cypress/support/component.ts
View File

@ -22,7 +22,7 @@ import './commands';
// Alternatively you can use CommonJS syntax: // Alternatively you can use CommonJS syntax:
// require('./commands') // require('./commands')
import { mount } from '@cypress/react'; import { mount } from '@cypress/react'
// Augment the Cypress namespace to include type definitions for // Augment the Cypress namespace to include type definitions for
// your custom command. // your custom command.

108
eslint.config.ts
View File

@ -4,62 +4,52 @@ import reactPlugin from 'eslint-plugin-react';
import globals from 'globals'; import globals from 'globals';
export default tseslint.config( export default tseslint.config(
{ eslint.configs.recommended,
ignores: [ ...tseslint.configs.recommended,
'**/build/**', {
'**/webpack.config.ts', files: ['**/*.{js,jsx,ts,tsx}'],
'**/webpack.config.dev.ts', ignores: [
'**/webpack.config.dev.server.ts', 'build/',
'**/webpack.cy.config.ts', 'webpack.config.ts',
'**/service-worker.ts', 'webpack.config.dev.ts',
'**/serviceWorkerRegistration.ts', 'webpack.config.dev.server.ts',
'node_modules/**' 'webpack.cy.config.ts',
] 'service-worker.ts',
}, 'serviceWorkerRegistration.ts'
eslint.configs.recommended, ],
...tseslint.configs.recommended, languageOptions: {
{ ecmaVersion: 'latest',
files: ['**/*.{js,jsx,ts,tsx}'], sourceType: 'module',
languageOptions: { parser: tseslint.parser,
ecmaVersion: 'latest', parserOptions: {
sourceType: 'module', ecmaFeatures: {
parser: tseslint.parser, jsx: true
parserOptions: { },
ecmaFeatures: { globals: {
jsx: true ...globals.browser,
}, ...globals.node,
globals: { ...globals.es2021
...globals.browser, }
...globals.node, }
...globals.es2021 },
} plugins: {
} react: reactPlugin,
}, '@typescript-eslint': tseslint.plugin
plugins: { },
react: reactPlugin, settings: {
'@typescript-eslint': tseslint.plugin react: {
}, version: 'detect'
settings: { }
react: { },
version: 'detect' rules: {
} 'indent': ['error', 'tab'],
}, 'linebreak-style': ['error', 'unix'],
rules: { 'quotes': ['error', 'single'],
// Include here the recommended rules for react 'semi': ['error', 'always'],
...reactPlugin.configs.recommended.rules, 'eol-last': ['error', 'always'],
'indent': ['error', 'tab'], '@typescript-eslint/no-var-requires': 'off',
'linebreak-style': ['error', 'unix'], // Include here the recommended rules for react
'quotes': ['error', 'single'], ...reactPlugin.configs.recommended.rules
'semi': ['error', 'always'], }
'eol-last': ['error', 'always'], }
'@typescript-eslint/no-var-requires': 'off', );
'@typescript-eslint/no-require-imports': 'off',
'no-undef': 'off',
'@typescript-eslint/no-namespace': 'off',
'@typescript-eslint/no-unused-vars': 'off',
'@typescript-eslint/no-explicit-any': 'off',
'@typescript-eslint/no-unused-expressions': 'off',
}
}
);

1990
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

49
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "@aleleba/create-react-ssr", "name": "@aleleba/create-react-ssr",
"version": "3.9.31", "version": "3.9.28",
"description": "Starter Kit of server side render of react", "description": "Starter Kit of server side render of react",
"bin": "./bin/cli.js", "bin": "./bin/cli.js",
"main": "src/server/index", "main": "src/server/index",
@ -37,19 +37,19 @@
"homepage": "https://github.com/aleleba/create-react-ssr#readme", "homepage": "https://github.com/aleleba/create-react-ssr#readme",
"dependencies": { "dependencies": {
"@babel/register": "^7.25.9", "@babel/register": "^7.25.9",
"dotenv": "^16.5.0", "dotenv": "^16.4.7",
"express": "^5.1.0", "express": "^4.21.2",
"helmet": "^8.1.0", "helmet": "^8.1.0",
"history": "^5.3.0", "history": "^5.3.0",
"ignore-styles": "^5.0.1", "ignore-styles": "^5.0.1",
"react": "^19.1.0", "react": "^19.0.0",
"react-dom": "^19.1.0", "react-dom": "^19.0.0",
"react-redux": "^9.2.0", "react-redux": "^9.2.0",
"react-router-dom": "^7.5.0", "react-router-dom": "^7.4.0",
"react-router-hash-link": "^2.4.3", "react-router-hash-link": "^2.4.3",
"redux": "^5.0.1", "redux": "^5.0.1",
"webpack": "^5.99.5", "webpack": "^5.98.0",
"webpack-dev-server": "^5.2.1", "webpack-dev-server": "^5.2.0",
"webpack-manifest-plugin": "^5.0.1", "webpack-manifest-plugin": "^5.0.1",
"workbox-background-sync": "^7.3.0", "workbox-background-sync": "^7.3.0",
"workbox-broadcast-update": "^7.3.0", "workbox-broadcast-update": "^7.3.0",
@ -70,21 +70,21 @@
"@babel/preset-react": "^7.26.3", "@babel/preset-react": "^7.26.3",
"@babel/preset-typescript": "^7.27.0", "@babel/preset-typescript": "^7.27.0",
"@cypress/react": "^9.0.1", "@cypress/react": "^9.0.1",
"@eslint/js": "^9.24.0", "@eslint/js": "^9.23.0",
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.16", "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
"@redux-devtools/extension": "^3.3.0", "@redux-devtools/extension": "^3.3.0",
"@testing-library/jest-dom": "^6.6.3", "@testing-library/jest-dom": "^6.6.3",
"@testing-library/react": "^16.3.0", "@testing-library/react": "^16.2.0",
"@testing-library/user-event": "^14.6.1", "@testing-library/user-event": "^14.6.1",
"@types/jest": "^29.5.14", "@types/jest": "^29.5.14",
"@types/node": "^22.14.0", "@types/node": "^22.13.13",
"@types/react": "^19.1.0", "@types/react": "^19.0.12",
"@types/react-dom": "^19.1.2", "@types/react-dom": "^19.0.4",
"@types/webpack": "^5.28.5", "@types/webpack": "^5.28.5",
"@types/webpack-hot-middleware": "^2.25.9", "@types/webpack-hot-middleware": "^2.25.9",
"@types/webpack-node-externals": "^3.0.4", "@types/webpack-node-externals": "^3.0.4",
"@typescript-eslint/eslint-plugin": "^8.29.1", "@typescript-eslint/eslint-plugin": "^8.28.0",
"@typescript-eslint/parser": "^8.29.1", "@typescript-eslint/parser": "^8.28.0",
"babel-jest": "^29.7.0", "babel-jest": "^29.7.0",
"babel-loader": "^10.0.0", "babel-loader": "^10.0.0",
"clean-webpack-plugin": "^4.0.0", "clean-webpack-plugin": "^4.0.0",
@ -92,9 +92,9 @@
"copy-webpack-plugin": "^13.0.0", "copy-webpack-plugin": "^13.0.0",
"css-loader": "^7.1.2", "css-loader": "^7.1.2",
"css-minimizer-webpack-plugin": "^7.0.2", "css-minimizer-webpack-plugin": "^7.0.2",
"cypress": "^14.3.0", "cypress": "^14.2.0",
"eslint": "^9.24.0", "eslint": "^9.23.0",
"eslint-plugin-react": "^7.37.5", "eslint-plugin-react": "^7.37.4",
"eslint-webpack-plugin": "^5.0.0", "eslint-webpack-plugin": "^5.0.0",
"file-loader": "^6.2.0", "file-loader": "^6.2.0",
"globals": "^16.0.0", "globals": "^16.0.0",
@ -103,17 +103,16 @@
"jest": "^29.7.0", "jest": "^29.7.0",
"jest-environment-jsdom": "^29.7.0", "jest-environment-jsdom": "^29.7.0",
"jest-fetch-mock": "^3.0.3", "jest-fetch-mock": "^3.0.3",
"jiti": "^2.4.2",
"mini-css-extract-plugin": "^2.9.2", "mini-css-extract-plugin": "^2.9.2",
"react-refresh": "^0.17.0", "react-refresh": "^0.16.0",
"resolve-ts-aliases": "^1.0.1", "resolve-ts-aliases": "^1.0.1",
"sass": "^1.86.3", "sass": "^1.86.0",
"sass-loader": "^16.0.5", "sass-loader": "^16.0.5",
"style-loader": "^4.0.0", "style-loader": "^4.0.0",
"terser-webpack-plugin": "^5.3.14", "terser-webpack-plugin": "^5.3.14",
"ts-jest": "^29.3.1", "ts-jest": "^29.3.0",
"typescript": "^5.8.3", "typescript": "^5.8.2",
"typescript-eslint": "^8.29.1", "typescript-eslint": "^8.28.0",
"url-loader": "^4.1.1", "url-loader": "^4.1.1",
"webpack-cli": "^6.0.1", "webpack-cli": "^6.0.1",
"webpack-dev-middleware": "^7.4.2", "webpack-dev-middleware": "^7.4.2",

4
src/@types/express/index.d.ts vendored
View File

@ -1,4 +1,4 @@
import * as express from 'express'; import * as express from "express"
declare global { declare global {
namespace Express { namespace Express {
@ -6,4 +6,4 @@ declare global {
hashManifest?: Record<string,any> hashManifest?: Record<string,any>
} }
} }
} }

2
src/@types/index.d.ts vendored
View File

@ -1,4 +1,4 @@
declare module '*.svg' { declare module "*.svg" {
const content: any; const content: any;
export default content; export default content;
} }

28
src/__mocks__/ProviderMock.tsx
View File

@ -6,22 +6,22 @@ import initialStateReducer from '../frontend/reducers/initialState';
import setStore from '../frontend/setStore'; import setStore from '../frontend/setStore';
export const ProviderMock = ({ children, initialState }: { children: any, initialState?: any}) => { export const ProviderMock = ({ children, initialState }: { children: any, initialState?: any}) => {
let initialStateMock = initialStateReducer; let initialStateMock = initialStateReducer
if(initialState !== undefined){ if(initialState !== undefined){
initialStateMock = initialState; initialStateMock = initialState
} }
const history = createMemoryHistory(); const history = createMemoryHistory();
const store = setStore({ initialState: initialStateMock }); const store = setStore({ initialState: initialStateMock });
return( return(
<Provider store={store}> <Provider store={store}>
<Router location={history.location} navigator={history}> <Router location={history.location} navigator={history}>
{children} {children}
</Router> </Router>
</Provider> </Provider>
); )
}; }
export default ProviderMock; export default ProviderMock;

10
src/frontend/actions/index.ts
View File

@ -1 +1,9 @@
export * from '@actions/testAction'; import test, { TTest } from './testAction';
export type TAction = TTest
const actions = {
test
}
export default actions

12
src/frontend/actions/testAction.ts
View File

@ -14,12 +14,12 @@ export interface IChangeHelloPayload {
export type TTest = IChangeHello export type TTest = IChangeHello
const changeHello = (payload: string) => ({ const changeHello = (payload: string) => ({
type: ActionTypesTest.ChangeHello, type: ActionTypesTest.ChangeHello,
payload payload
}); })
const actions = { const actions = {
changeHello changeHello
}; }
export default actions; export default actions

18
src/frontend/components/OtherComponent.tsx
View File

@ -1,18 +1,18 @@
import React from 'react'; import React from 'react';
import logo from '../logo.svg'; import logo from '../logo.svg';
import './InitialComponent.scss'; import './InitialComponent.scss';
import { Link } from 'react-router-dom'; import { Link } from "react-router-dom";
const OtherComponent = () => ( const OtherComponent = () => (
<div className="App"> <div className="App">
<header className="App-header"> <header className="App-header">
<img src="assets/img/logo.svg" className="App-logo" alt="logo" /> <img src="assets/img/logo.svg" className="App-logo" alt="logo" />
<p> <p>
Edit <code>src/frontend/OtherComponent.jsx</code> and save to reload. Edit <code>src/frontend/OtherComponent.jsx</code> and save to reload.
</p> </p>
<Link className="App-link" to="/">Initial Component</Link> <Link className="App-link" to="/">Initial Component</Link>
</header> </header>
</div> </div>
); );
export default OtherComponent; export default OtherComponent;

2
src/frontend/components/PrincipalRoutes.tsx
View File

@ -4,7 +4,7 @@ import { useRoutes } from 'react-router-dom';
import routes from '../../routes'; import routes from '../../routes';
const PrincipalRoutes = () => { const PrincipalRoutes = () => {
const element = useRoutes(routes); let element = useRoutes(routes);
return element; return element;
}; };

30
src/frontend/components/__tests__/App.test.tsx
View File

@ -4,20 +4,20 @@ import { ProviderMock } from '@mocks';
import App from '@components/App'; import App from '@components/App';
describe('<App/> Component', () => { describe('<App/> Component', () => {
beforeEach(() => { beforeEach(() => {
fetchMock.resetMocks(); fetchMock.resetMocks();
}); });
it('Should render root <App /> Component', async () => { it('Should render root <App /> Component', async () => {
fetchMock.mockResponseOnce(JSON.stringify({ fetchMock.mockResponseOnce(JSON.stringify({
//First Data Fetch //First Data Fetch
data: 'data' data: 'data'
})); }));
render( render(
<ProviderMock> <ProviderMock>
<App /> <App />
</ProviderMock> </ProviderMock>
); )
}); })
}); })

6
src/frontend/reducers/index.ts
View File

@ -1,6 +1,10 @@
import { combineReducers } from 'redux'; import { combineReducers } from 'redux';
import testReducer from './testReducer'; import testReducer from './testReducer';
export * from './initialState'; import { IChangeHelloPayload } from '../actions/testAction';
export interface IInitialState {
testReducer?: IChangeHelloPayload | undefined
}
const rootReducer = combineReducers({ const rootReducer = combineReducers({
// Here comes the reducers // Here comes the reducers

5
src/frontend/reducers/initialState.ts
View File

@ -1,6 +1,3 @@
import { IChangeHelloPayload } from '@actions'; import { IInitialState } from './';
export interface IInitialState {
testReducer?: IChangeHelloPayload | undefined
}
const initialState: IInitialState = {}; const initialState: IInitialState = {};
export default initialState; export default initialState;

4
src/frontend/reducers/testReducer.ts
View File

@ -1,10 +1,10 @@
import { TTest } from '@actions'; import { TAction } from '../actions';
const initialState = { const initialState = {
hello: 'world' hello: 'world'
}; };
const testReducer = (state = initialState, action: TTest) => { const testReducer = (state = initialState, action: TAction) => {
switch (action.type){ switch (action.type){
case 'CHANGE_HELLO': { case 'CHANGE_HELLO': {
const newHello = action.payload.hello; const newHello = action.payload.hello;

7
src/frontend/setStore.ts
View File

@ -3,7 +3,8 @@ import { legacy_createStore as createStore} from 'redux'; //, applyMiddleware
// import { Provider } from 'react-redux'; // import { Provider } from 'react-redux';
import { composeWithDevTools as composeWithDevToolsWeb } from '@redux-devtools/extension'; import { composeWithDevTools as composeWithDevToolsWeb } from '@redux-devtools/extension';
import { config } from '../../config'; import { config } from '../../config';
import reducer, { IInitialState } from '@reducers'; import reducer, { IInitialState } from './reducers';
const { ENV } = config; const { ENV } = config;
@ -14,11 +15,11 @@ const composeEnhancers = composeWithDevToolsWeb({
const setStore = ({ initialState }: { initialState: IInitialState | undefined }) => { const setStore = ({ initialState }: { initialState: IInitialState | undefined }) => {
const store = ENV === 'development' ? createStore( const store = ENV === 'development' ? createStore(
reducer, reducer,
initialState as any, initialState,
composeEnhancers(), composeEnhancers(),
) : createStore( ) : createStore(
reducer, reducer,
initialState as any, initialState,
); );
return store; return store;
}; };

2
src/server/server.tsx
View File

@ -129,7 +129,7 @@ const renderApp = (req, res, next) => {
}; };
app app
.get('/{*splat}', renderApp); .get('*', renderApp);
app.listen(PORT, () => { app.listen(PORT, () => {
console.log(`Server running on port ${PORT}`); console.log(`Server running on port ${PORT}`);

11
webpack.config.dev.server.ts
View File

@ -49,16 +49,7 @@ const config: Configuration = {
'options': { 'options': {
modules: { modules: {
auto: /\.module\.\w+$/i, auto: /\.module\.\w+$/i,
}, }
url: {
filter: (url) => {
// No procesar URLs absolutas que comienzan con /
if (url.startsWith('/')) {
return false;
}
return true;
}
},
}, },
}, },
'sass-loader', 'sass-loader',

17
webpack.config.dev.ts
View File

@ -35,12 +35,6 @@ if(fs.existsSync(`${ROOT_DIR}/../public/img`)){
}); });
} }
if(fs.existsSync(`${ROOT_DIR}/../public/fonts`)){
copyPatterns.push({
from: `${ROOT_DIR}/../public/fonts`, to: 'assets/fonts',
});
}
const config: Configuration = { const config: Configuration = {
entry: [`webpack-hot-middleware/client?path=${envConfig.PREFIX_URL}/reload_wss&timeout=2000&reload=true&autoConnect=true`, `${ROOT_DIR}/../src/frontend/index.tsx`], entry: [`webpack-hot-middleware/client?path=${envConfig.PREFIX_URL}/reload_wss&timeout=2000&reload=true&autoConnect=true`, `${ROOT_DIR}/../src/frontend/index.tsx`],
output: { output: {
@ -74,16 +68,7 @@ const config: Configuration = {
'options': { 'options': {
modules: { modules: {
auto: /\.module\.\w+$/i, auto: /\.module\.\w+$/i,
}, }
url: {
filter: (url) => {
// No procesar URLs absolutas que comienzan con /
if (url.startsWith('/')) {
return false;
}
return true;
}
},
}, },
}, },
'sass-loader', 'sass-loader',

17
webpack.config.ts
View File

@ -41,12 +41,6 @@ if(fs.existsSync(`${ROOT_DIR}/public/img`)){
}); });
} }
if(fs.existsSync(`${ROOT_DIR}/public/fonts`)){
copyPatterns.push({
from: `${ROOT_DIR}/public/fonts`, to: 'assets/fonts',
});
}
const frontendConfig = { const frontendConfig = {
entry: { entry: {
frontend: `${ROOT_DIR}/src/frontend/index.tsx`, frontend: `${ROOT_DIR}/src/frontend/index.tsx`,
@ -79,16 +73,7 @@ const frontendConfig = {
'options': { 'options': {
modules: { modules: {
auto: /\.module\.\w+$/i, auto: /\.module\.\w+$/i,
}, }
url: {
filter: (url) => {
// No procesar URLs absolutas que comienzan con /
if (url.startsWith('/')) {
return false;
}
return true;
}
},
}, },
}, },
'sass-loader', 'sass-loader',

17
webpack.cy.config.ts
View File

@ -23,12 +23,6 @@ if(fs.existsSync(copyFromUrl)){
}); });
} }
if(fs.existsSync(`${path.resolve(__dirname)}/public/fonts`)){
copyPatterns.push({
from: `${path.resolve(__dirname)}/public/fonts`, to: 'assets/fonts',
});
}
export default { export default {
entry: './src/frontend/components/index.tsx', entry: './src/frontend/components/index.tsx',
resolve: { resolve: {
@ -77,16 +71,7 @@ export default {
'options': { 'options': {
modules: { modules: {
auto: /\.module\.\w+$/i, auto: /\.module\.\w+$/i,
}, }
url: {
filter: (url) => {
// No procesar URLs absolutas que comienzan con /
if (url.startsWith('/')) {
return false;
}
return true;
}
},
}, },
}, },
'sass-loader', 'sass-loader',