Webpack с бэкэндом узла на одном процессе / одном и том же порту с горячей перезагрузкой для передней и задней части…? - PullRequest
Новая
       37

Webpack с бэкэндом узла на одном процессе / одном и том же порту с горячей перезагрузкой для передней и задней части…?

0 голосов
/ 18 июня 2019

У меня довольно стандартная настройка с бэкэндом узла, который служит SPA в качестве пакета веб-пакета, а также API, обслуживающим это приложение SPA.В бэкэнде используется koa2.

Так что у меня была горячая перезагрузка, которая отлично работала для передней части, но теперь у меня немного больше работы с бэкэндом, и мне нужно ускорить мои поездки туда и обратно.

Мне интересно, каков наилучший подход.Я начал с:

1.Начальная загрузка из веб-пакета

Я использовал веб-пакет, который в то время казался стандартным, и добавил KOA в качестве промежуточного программного обеспечения в конфигурации веб-пакета: 

serve: {
  add: app => {
    require('./src/node/backend')(app)
}
....

Это, однако, не приводит к перезагрузке бэкэнда иэто довольно болезненно, так как мне нужно перезапустить всю команду webpack-serve при смене серверной части.

Итак, я попытался

2 Начальная загрузка из серверной части узла с веб-пакетом в качестве промежуточного программного обеспечения 

const Koa = require('koa')
const koaWebpack = require('koa-webpack')
const webpack = require('webpack')
const app = new Koa()

const config = require('../../webpack.dev.js')
const compiler = webpack(config)

koaWebpack({ compiler }).then(middleware => {
  require('./backend')(app) // delegate to the common
  app.listen(process.env.port)
  app.use(middleware)
  return app
})

Это прекрасно работает и для внешнего интерфейса, но у меня до сих пор нет перезагрузки бэкэнда, поэтому в основном тот же опыт.

3.Запуск webpack-dev-server и backend как разных процессов.

Это работает нормально, и тогда я могу использовать nodemon для бэкэнда koa, что достаточно для меня, но затем мне нужно сделать некоторую перестановку портовЯ думаю.

Полагаю, webpack-dev-server / webpack-serve могут выступать в роли прокси-сервера и передавать данные через бэкэнд, если они не попадают ни в один из моих интерфейсов.Но все это кажется утомительным.Я бы предпочел соединить все это вместе на одном и том же порту.

Так есть ли какой-нибудь другой простой способ перезагрузить две сборки, но по-прежнему работать вместе на одном и том же порту…?

Iнашел этот проект https://github.com/vlazh/node-hot-loader,, который может быть интересным, но я действительно чувствовал необходимость спросить раньше, если я пропускаю что-то более очевидное, так как я на самом деле рад перезапустить мой стиль сервера нодмонов ... (это маленький и быстрый)

1 Ответ

0 голосов
/ 18 июня 2019

После тщательного поиска я нашел несколько инструментов для решения этой проблемы, но все они использовали веб-пакет для объединения кода на стороне сервера, что, на мой взгляд, является излишним для меня на этом этапе.

Я закончил тем, что сделалперезагрузите приложение для серверной части, оставаясь в альтернативе 2 выше.Так что для бэкэнда koa я просто добавил средство просмотра файлов, чтобы сделать недействительным кеш-память для сервера dev: 

const chokidar = require('chokidar')
const watcher = chokidar.watch('.')
watcher.on('ready', () => {
  watcher.on('all', () => {
    Object.keys(require.cache).forEach(function(id) {
      if (id.indexOf('src/node') > 0 && id.indexOf('node_modules') < 0) {
        delete require.cache[id]
      }
    })
  })
})

Затем указатель, так что всегда передается требование в dev: 

const reloadable =
  process.env.NODE_ENV === 'development' ? id => (ctx, next) => require(id).then(r => r(ctx, next)) : id => require(id)

который я затем использую во всех определениях маршрута, таких как: 

const use = app.use.bind(app)
reloadable('./auth').then(use)
reloadable('./users').then(use)
reloadable('./ingredients').then(use)

Это было достаточно для меня.

...