Нужен ли мне webpack-dev-server, если я использую сервер узла, например экспресс?

Я следую нескольким руководствам по созданию изоморфного приложения с помощью express и react. Я путаю с webpack-dev-сервером.

В руководстве по webpack говорится о webpack-dev-сервере:

Это связывает небольшой экспресс-сервер на localhost: 8080, который обслуживает ваши статические ресурсы, а также пакет (скомпилированный автоматически).

Он автоматически обновляет страницу браузера при перекомпиляции пакета (socket.io). Откройте в браузере http://localhost:8080/webpack-dev-server/bundle. .

Так как у меня есть экспресс-сервер, действительно ли мне нужен webpack-dev-server? Или в чем преимущества и недостатки его использования? И если я хочу использовать react-hot-loader, нужен ли webpack-dev-server?


person Brick Yang    schedule 28.10.2015    source источник


Ответы (1)


Так как у меня есть экспресс-сервер, действительно ли мне нужен webpack-dev-server?

Да и нет. Вы можете использовать гибридный подход, который, по сути, настраивает webpack-dev-server как прокси. У вас есть экспресс-сервер, который обслуживает все, кроме активов. Если это актив, запрос перенаправляется / проксируется на сервер webpack-dev. Для получения дополнительных сведений см. Ответ здесь: Как разрешить webpack-dev-серверу разрешать точки входа с реактивного маршрутизатора

В качестве альтернативы вы можете использовать webpack-dev-middleware и webpack-hot-middleware, если вы не хотите иметь дело со всей беспорядочной логикой проксирования и двумя запущенными серверами. См. Пример здесь: https://github.com/glenjamin/webpack-hot-middleware/blob/master/example/server.js

в чем преимущества и недостатки его использования?

Живая перезагрузка и замена горячих модулей. На мой взгляд, очень полезная функция для разработки

И если я хочу использовать react-hot-loader, нужен ли webpack-dev-server?

Нет, он работает поверх интерфейса горячей замены модуля Webpack. Вы можете создать свой собственный «горячий сервер», если хотите. Клиент webpack-dev-server просто слушает socket.io на предмет горячих обновлений и вызывает postMessage (https://github.com/webpack/webpack-dev-server/blob/8e8f540b2f7b35f7b6c3ce616a7fd2215aaa6eea/client/index#L64-L67), который затем выбирается сервером https://github.com/webpack/webpack/blob/bac9b48bfb0f7dd9732f2faafb43ebb22ee2a2a7/hot/only-dev-server.js#L59-L67.

Или то, что я рекомендую, - вместо этого вы можете просто использовать промежуточное ПО webpack-dev-middleware и webpack-hot-middleware, о которых я упоминал выше. Таким образом, вам не нужно беспокоиться о логике прокси, и вы можете легко интегрировать горячую перезагрузку в существующий экспресс-сервер без необходимости в webpack-dev-server.

person trekforever    schedule 28.10.2015
comment
Спасибо! Итак, могу ли я сказать, что лучшая практика использования react-hot-loader - это использование промежуточного программного обеспечения, которое вы упомянули? Что, если учесть производственную среду? Я не думаю, что мне здесь нужен live-reloader, верно? Так следует ли мне удалить коды промежуточного программного обеспечения? - person Brick Yang; 28.10.2015
comment
response-hot-loader становится устаревшим, поэтому я бы посмотрел на github.com/gaearon/react- transform-hmr (того же автора). Да, вам не нужна перезагрузка в реальном времени для производства, поэтому в вашем server.js я бы просто условно проверил env. Если это разработка, используйте промежуточное ПО. иначе, просто пропустите это. - person trekforever; 28.10.2015
comment
Спасибо за развернутый ответ! Как только вы это сделаете, что вы будете делать на производстве? - person Madara's Ghost; 10.10.2016
comment
@BrickYang Я использую приложения Rails v3 и Rails v4 на Phusion Passenger (в производственной среде environemnet). Если бы мне пришлось создать приложение Rails 5.1 в своем корпусе разработчика (Ubuntu) и использовать Webpack, почему бы localhost не мог обслуживать ресурсы? Зачем нужен webpack-dev-сервер? - person Chris; 02.06.2017
comment
@Chris Я не знаком с Rails, но сейчас использую webpack-dev-server. На самом деле вы не создаете какой-либо файл на диск в dev env, поэтому такой файл не может обслуживаться на localhost. Webpack-dev-server генерирует и обслуживает файлы в памяти. Перед развертыванием приложения вам необходимо один раз запустить webpack, чтобы собрать реальные файлы на диск для pro env. - person Brick Yang; 02.06.2017