JHipster：每次升级都会出现黑屏

Question

每次 jhipster 升级其版本时，我都会遇到一个反复出现的问题。我的应用程序在http://localhost:8080 处突然变为空白，显示为空白屏幕。而且我当时没有重新生成或重新运行yo jhipster。编译顺利，没有错误消息。

我通过运行 jhipster 的手动升级并再次重新生成所有内容来解决它（这很烦人）。烦人的部分是我需要查看每个文件的 diff，因为我对一些生成的文件进行了一些修改。

我的问题是：

1. 如何在不更改本地代码的情况下调用mvnw 依赖于互联网上发布的最新版本的 jhipster？

2. 什么原因导致空白屏幕？

3. 每次 jhipster 发布新版本时，我是否需要重新生成我的应用程序？

谢谢。

Answer 1

空白屏幕通常意味着，有一些 JS 错误。您需要进入浏览器的开发者控制台才能看到错误。

尽管我们的上一个版本修复了升级生成器，该生成器在所有 4.0.X 版本中都已损坏，但我没有尝试过。我还需要一个更好的升级流程，所以我只是手动执行了升级生成器中的步骤，这真的让事情变得更容易了。以下是您始终可以走的路：

1. 转到要应用更新的分支。我将在我的示例中引用 master
2. 根据你的分支创建一个孤儿分支，git checkout --orphan upgrade-jhipster。孤立分支没有父版本，因此在合并期间，每个与您的主文件不同的文件最终都会发生合并冲突。如果没有这个，您只会覆盖您的更改，因为升级中的任何更改都将晚于您的更改。
3. 确保您在项目根目录中运行最新的生成器。请记住，JHipster 会在生成后放置一个生成器的副本，以确保您可以使用生成您的应用程序的版本，即使您进行了全局升级。
4. 运行 yo jhipster --with-entities --force 并将更改提交到您的 upgrade-jhipster 分支
5. 现在git checkout master 和git merge upgrade-jhipster

如果您在某些带有可视合并对话框的工具中执行最后一步，例如 IntelliJ，升级进度非常容易处理，并且不像 yeoman diff 那样烦人。

根据您的更改的自定义程度，仍然不能保证这会导致无错误状态。但这正是升级生成器试图做的事情。一个区别是，手动方法不会像升级生成器那样删除过时的文件。但是，我正在以这种方式升级我非常定制的 JHipster 项目，并且效果很好

Answer 2

当您使用 ./mvnw 启动应用程序时，您会在开发模式下启动应用程序，因此 Web 前端不是“web-packed”并且无法提供服务。如果您想在开发模式下为 Web 前端提供服务，推荐的方法是这样做

1. ./mvnw
2. 在另一个终端 yarn start 这将启动 webpack 开发服务器并将其连接到后端。

在节点模块发生更改的升级后，您可能必须先键入 yarn 以确保所有依赖项都已导入。

您也可以先构建前端

1. yarn webpack:build
2. ./mvnw

这样做的缺点是，每次前端发生变化时，您都必须重新构建 webpack。如果您使用yarn start 为前端服务，则不必这样做。

生产版本总是 webpack 前端。

我注意到的另一件事是 JHipster 的某些版本和选项似乎希望在 build 目录中构建 Web 前端，而不是预期的 target 目录。 Web 前端应位于target/www/app。如果在yarn webpack:build 之后它不存在，那么就有问题了。很可能是ts.config，它的值应该是"outDir": "target/www/app"，但可能还有其他地方。我之前必须更正此问题，并在目录中搜索包含需要更改的 "build/www/app" 的行。

最后一个技巧是删除节点模块，删除目标目录（以及构建目录，如果有的话）并执行以下操作：

1. yarn install && yarn webpack:build
2. ./mvnw