React и angular c общей папкой node_modules

Вопрос-ответ Nodejs
1

Как установить react и angular c общей папкой node_modules и запускать сервер react и angular? Допустим, есть папка scr для скриптов angular и папка scr1 для react. Angular запускается (npm start - localhost:4200), когда пытаюсь запустить react (cd scr1, npm start) ничего не выходит, лишь запускается папка angular снова.question
Вот файл package.json
{
“name”: “my-app”,
“version”: “0.0.0”,
“scripts”: {
“ng”: “ng”,
“start”: “ng serve”,
“build”: “ng build”,
“test”: “ng test”,
“lint”: “ng lint”,
“e2e”: “ng e2e”
},
“private”: true,
“dependencies”: {
“@angular/animations”: “~11.2.1”,
“@angular/common”: “~11.2.1”,
“@angular/compiler”: “~11.2.1”,
“@angular/core”: “~11.2.1”,
“@angular/forms”: “~11.2.1”,
“@angular/platform-browser”: “~11.2.1”,
“@angular/platform-browser-dynamic”: “~11.2.1”,
“@angular/router”: “~11.2.1”,
“react”: “^17.0.1”,
“react-dom”: “^17.0.1”,
“rxjs”: “~6.6.0”,
“tslib”: “^2.0.0”,
“zone.js”: “~0.11.3”
},
“devDependencies”: {
“@angular-devkit/build-angular”: “~0.1102.1”,
“@angular/cli”: “~11.2.1”,
“@angular/compiler-cli”: “~11.2.1”,
“@types/jasmine”: “~3.6.0”,
“@types/node”: “^12.11.1”,
“codelyzer”: “^6.0.0”,
“jasmine-core”: “~3.6.0”,
“jasmine-spec-reporter”: “~5.0.0”,
“karma”: “~6.1.0”,
“karma-chrome-launcher”: “~3.1.0”,
“karma-coverage”: “~2.0.3”,
“karma-jasmine”: “~4.0.0”,
“karma-jasmine-html-reporter”: “^1.5.0”,
“protractor”: “~7.0.0”,
“ts-node”: “~8.3.0”,
“tslint”: “~6.1.0”,
“typescript”: “~4.1.2”
}
}

2

А какие файлы src/package.json и src1/package.json ?

в вашем случае в корневом package.json не описана команда запуска реакта, типа такого:

"scripts": {
    "dev:angular": "ng serve",
    "dev:react": "cd src1 && react-scripts start",
    ...
}

и не видно в devDependencies — create react app ("react-scripts": "4.0.1",) или что у вас реакт должно запускать.

как бы ваш подход изначавльно не стандартный так как оба фреймворка захардкожены на src папку, а общая node_modules в таком случае может использоваться системная-глобальная, когда установка идет через npm install -g …

P.S.:

pushd src1 && react-scripts start && popd
3

Нет. Потому что у вас есть package-lock.json, а это значит что даже если у вас одни и те же либы - у них могут быть разные версии. Но можно устанавливать либы глобально, а в случае чего прописывать локальный node_modules. Также можно использовать NODE_PATH.

А вообще затея странная.

4

Я никогда раньше не пробовала устанавливать ангулар и реакт с общим node_modules. Я так поняла нужно переписать файл package.json, указав в нем то, что вы описали, потом снова сделать npm install.
Если нужно будет удалить папку node_modules, не будет ничего страшного, если удалить мышкой delete ?

5

Вы говорите затея странная, по вашему нужно для react и angular отдельные mode_modules делать? Это слишком большие файлы, я подумала, почему бы их не объединить. Как обычно делают в таких случаях?

6

затея странная поскольку React и Angular - два альтернативных решения для одного и того же. Так как реакт библиотека, теоретически он мог быть интегрирован внутрь Angular, но тут это не так. Значит у нас два разных проекта. Но при этом вы делаете один mode_modules. Для чего? Экономия места? сомнительно при копеечной стоимости дискового пространства на сервере.

Если стоит задача именно запустить на серваке два и более сервиса, именно на серваке, а не в разработке, посмотрите на продукты вроде pm2. В нем можно создать конфиг с запуском чего угодно, как угодно, ну и собственно оно так и делается.

Если же вы хотите чтобы линуксоидные продукты, вроде pm2, у вас работали и на винде тоже. Тогда вам нужен докер или что-то аналогичное еще к ноде и pm2.

7

Я тоже. В этом нет смысла) Так как если вам потребовалось в одном месте размещать Angular/React это повидимому значит, — что есть микросервисная архитектура, где каждое отдельное приложение примонтировано к своей DOM ноде и работает независимо.
А соответсвенно в каждом приложении будут уникальные пакеты. Представляю нового разработчика которому прийдется и из git-а клонить 2 проекта в одном и потом устанавливать все пакеты хотя, изменение ему надо делать только в одном.

Одним node_modules вы ничего не экономите, кроме дискового пространства девелопера, так как при npm build исходник все равно будет уникальны и содержать минимум кода.

Секция “scripts” и описывает команлы npm run, npm start → npm run start.

Можно удалять мышкой, проблем не будет. npm i закачивает по новой. Вохможно еще package-lock.json надо удалить.