Деплой проекта React.js + Nodejs (Koa) + Typescript. Как сделать?

Question

[Дмитрий]

Знаю все или почти все о создании приложения на реакт
Знаю многое о создании приложения на node.js

Но с деплоем ни разу раньше не сталкивался и застрял на первом же шаге. Даже отбрасывая в сторону Реакт, не могу сбилдить бэкенд.

Нашел на одном из сайтов следующую инструкцию:

- 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"

Но после выполнения npm run build никакого index.js в билде нет, только app.js

Приложения на реакте и ноде написаны и локально работают в режиме разработки
Соответственно 2 вопроса:
1) Какой самый простой способ сбилдить node.js ?
2) Как соединить Реакт и бэк, если они написаны раздельно? Сбилдить реакт, добавить index.js в проект на бэке и добавить к нему роутер get('/' ... ? Или кинуть билд реакта в папку на сервере, где запущен node И как-то настроить htaccess чтобы серверный скрипт принимал только '/api' запросы, а остальные переадресовывал на билд реакта?

Буду благодарен за любую помощь, потому что искать примеры в интернете, потом искать темы с ошибками, возникающими при применении этих примеров, несколько муторное занятие. Тем не менее если есть ссылки с простым толковым описанием будет отлично.

Заранее большое спасибо.

Answer 1

[WebEagle]

Я собираю с помощью rollup
в package.json в scripts добавляем

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

в package.json в 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'
        }

    },
]

Comments

[Дмитрий]

Благодарю попробую