D
D
Dmitry2021-03-31 14:49:21
Software Deployment
Dmitry, 2021-03-31 14:49:21

Deploy React.js + Nodejs (Koa) + Typescript project. How to do?

I know everything or almost everything about creating a React application.
I know a lot about creating an application on node.js.

But I have never encountered deployment before and got stuck at the first step. Even throwing aside React, I can’t bring down the backend.

I found the following instruction on one of the sites:

- npm install --save-dev rimraf
- add this to your package.json "build": "rimraf ./build && tsc"
- The startup script looks like this. "start": "npm run build && node build/index.js"

But after executing npm run build , there is no index.js in the build, only app.js

Applications on react and node are written and work locally in development mode
Accordingly, 2 questions:
1) What is the easiest way to build node.js ?
2) How to connect React and back if they are written separately? Build react, add index.js to the project on the back and add the get('/' ... router to it? Or throw the react build into the folder on the server where node is running And somehow configure htaccess so that the server script only accepts '/ api' requests, and redirected the rest to the react build?

I would be grateful for any help, because searching for examples on the Internet, then searching for topics with errors that occur when applying these examples, is a bit of a chore. Nevertheless, if there are links with a simple sensible description it will be great.

Thank you very much in advance.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
W
WebEagle, 2021-03-31
@WebEagle

I collect using rollup
in package.json in scripts add

"build:server": "rollup --config server/rollup.config.js",

add to package.json in dependencies
"rollup-plugin-json": "^4.0.0",
"rollup-plugin-terser": "^5.3.0",
"rollup-plugin-typescript2": "^0.26.0",

rollup.config.js
import typescript from 'rollup-plugin-typescript2';
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import json from 'rollup-plugin-json';
import pkg from "../package.json";
import copy from 'rollup-plugin-copy';

export default [
    {
        input: 'server/server.ts',
        plugins:[
            typescript({
                typescript: require('typescript'),
                "declaration": false,
                "module": "esnext",
                "noImplicitAny": false,
                "target": "es5",
                "skipLibCheck": true,
                "allowSyntheticDefaultImports": true,
                "lib": ["dom", "es6"],
                "typeRoots": ["node_modules/@types"]
            }),
            resolve({
                browser: false,
                main:true
            }),
            json(),
            commonjs(),
        ],
        external: [
            ...Object.keys(pkg.dependencies || {})
        ],
        output: {
            file: 'dist/server/server.js',
            format: 'cjs'
        }

    },
]

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question