Подключение клиентской и серверной машинописных проектов

Question

У меня есть один корневой проект, который содержит как серверные, так и клиентские приложения со примерно следующей структурой:

-- server
  -- node_modules
  -- index.ts
  -- package.json
  -- ...
-- client
  -- node_modules
  -- index.ts
  -- package.json
  -- html/
  -- css/
  -- ...

Я ищу лучший способ скомпилировать все это и сделать клиентскую часть статичнойфайлы, доступные для сервера. Я попытался это сделать, установив outDir на ../build для проекта server и установив его на ../build/static для проекта client. К сожалению, это не сработало, потому что tsc не работает с файлами за пределами корневой папки проекта (например, модули узла не могут быть вызваны из сборки, исправьте меня, если я ошибаюсь!).
Также,было бы очень хорошо, если бы я мог прослушивать изменения в файле машинописного текста и автоматически создавать этот файл при обнаружении такого изменения.

Я изучил такие параметры, как gulp, Webpack и parcel, но я неуверен, что самое лучшее и простое решение.

Один из способов заставить его работать - использовать один проект для server и client. Следующая структура:

-- node_modules
-- package.json
-- index.ts
-- server/
-- static/
--   html/
-- ...

но таким образом, существует только одна папка node_modules и один файл package.json для клиентской и серверной сторон, что может быть не лучшим способом (опять же, правильномне, если я ошибаюсь!).

Answer 1

crisp-реагировать имеет проекты сервера и клиента.

Сходства с вашей настройкой:- Проекты расположены в каталогах server/ и client/- Каждый проект имеет свои package.json и node_modules/- Использует Typescript- Статические файлы на стороне клиента доступны для сервера. - Авто сборка. Существуют сценарии использования, когда клиент автоматически перестраивается при изменении исходного кода. Это называется Live Reloading. То же самое относится и к коду сервера, он автоматически перестраивается при вводе изменений исходного кода.

Что отличается:- Нет каталога css/, поскольку CSS для каждого клиентского компонента находится в файле .tsx компонента. - Нет каталога html/, поскольку файлы .html создаются автоматически.

Наличие по одному package.json и tsconfig.json не кажется хорошей идеей, потому что зависимости и настройки довольно разные.