[vercel/next.js]自定义服务器的热重载

2024-05-15 159 views

回答

1

我猜最简单的方法是使用通常的节点服务器方式,使用 nodemon :smile:

8

我自己使用nodemon =>

nodemon -w server.js -w src -x env-cmd develop babel-node server.js
6

请注意,仅仅这样做nodemon server.js就会使整个过程陷入混乱。

2

看起来下一个开发服务器在提供服务时会修改源文件,这使得nodemon无法在不混淆的情况下观看源文件。当我尝试时,我的服务器陷入混乱nodemon -w pages -w components -w server.js server.js。只是nodemon -w server.js server.js我必须手动终止并重新启动服务器才能使其获取对非服务器文件的更改。

3

刚刚安装nodemon,希望重新加载自定义服务器路由 nextjs 应用程序并运行nodemon server.js。遇到了麻烦。绝对不推荐。有更好的解决方案吗?

3

我对 nodemon 不太熟悉,但由于某种原因nodemon server.js让我陷入困境,但nodemon -w server.js server.j工作正常。我每次交换都会得到冗余编译,但它有效。

2

让你们知道,您可以nodemon.json在项目根文件夹中配置一个文件:

{
  "verbose": true,
  "ignore": ["node_modules", ".next"],
  "watch": ["server/**/*", "index.js"],
  "ext": "js json"
}

对于那些正在使用babel-nodepresets

nodemon index.js --exec babel-node --presets es2015,stage-1,stage-2,stage-3

然而,就像 @pgsandstrom 的建议一样,您不会遇到混乱,但每次交换仍然会得到冗余编译。不过比手动服务器重新启动要好! ?

6

效果很好,谢谢@jimmylee?

4

@timneutkens 如果我将 nodemon 与自定义服务器一起使用,那么我将失去 webpack HMR 的所有优势。我不想要这样。我可以以某种方式帮助改善自定义服务器体验吗?

4

如果您仍然遇到问题,next.js(至少在 OSX 上)习惯于触摸页面目录中的文件,因此您还必须让 nodemon 忽略您的页面目录。 next.js 无论如何都会处理这些文件中的更改。

9

@timneutkens 如果我将 nodemon 与自定义服务器一起使用,那么我将失去 webpack HMR 的所有优势。我不想要这样。我可以以某种方式帮助改善自定义服务器体验吗?

我还面临着自定义服务器和 webpack HMR 的问题...有什么解决方案吗?还是什么都没有?

5

nodemon 示例解决了 HMR 问题。它只会在服务器文件更改时重新加载服务器,而不是下一个应用程序文件。

1

@sergiodxa我正在使用nodemon示例,但问题是当我在客户端应用程序中更改某些内容时,控制台会记录[HMR] bundle rebuilding,但它没有改变任何内容。只有当我刷新页面时...

我检查了发生的情况,并且我发现如果 TSlint 发出任何警告,HMR 将无法按预期工作...?

2

通过 nodemon 重新启动服务器进程意味着重新启动后需要构建新的客户端,这可能比内存刷新需要更长的时间。

可以通过几种不同的方式对服务器代码进行“热重载”,并具有不同程度的可靠性 - 但在一般情况下很难做到。

如果使用内置的下一个服务器和完全自定义的服务器之间存在中间地带,可以通过注入点添加路由,则可能可以支持在服务器上重新加载自定义路由模块,而无需重新启动整个过程 - 但是如果该模块中有任何有状态对象,那么这可能很难处理。

6

谢谢,有效

"dev": "nodemon -w server.js server.js"

sedubois/relate@5b7d8b2

我想知道我们是否可以在pages将文件夹移入时使用它src/pages

0

这里有更好的解决方案吗?

5

是的,通常情况下,默认的 Next.js 服务器与 Node.js API 分开运行,任何服务器端更改都会导致服务器重新加载并快速启动和运行。但使用自定义服务器,您将触发新的 Next.js 构建,并且您的开发站点将在更长时间内无法访问。

这是我使用自定义服务器时最大的痛苦——也许有某种方法可以与 Next.js 通信以仅使用之前输出的相同构建?这难道不能解决我们面临的问题吗?

4

与 Next.js v9 一起发布的替代解决方案是API 路由。他们首先解决了拥有自定义服务器的许多用例。

4

如果您本地需要 https,则 API 路由功能将不起作用。 https 有用的几个例子:

1) 如果您需要测试第三方集成,例如需要 https 保护域的https://clearbit.com/ 2) 如果您想在本地使用 cookie 的安全标志 3) 如果您的应用程序使用子域(用于多个-tenancy),您想要在本地进行测试,并且您的应用程序使用 Web Crypto(仅支持 https,本地主机除外)

https://github.com/zeit/next.js/issues/2633#issuecomment-317602742

To make it clear.

* We won't have SSL support in the core.
* But anyone can have it via our custom server API. (So, we welcome an example)
5

@kevlened 你能为此写一个 RFC 吗?我现在绝对愿意考虑它(你提到的评论已经有 2 年多了)。

3
{
  "verbose": true,
  "ignore": ["node_modules", ".next"],
  "watch": ["server/**/*", "index.js"],
  "ext": "js json"
}

然而我配置这个文件,它似乎只监视 server.js 文件。我有 .jsx 文件的 /pages 文件夹怎么样?我已经尝试过这个但没有效果:

{ "verbose": true, "ignore": ["node_modules", ".next"], "watch": ["server/**/*", "index.js", "pages/*"], "ext": "jsx js json" }