0

我是 Web 开发的新手，我被要求使用我选择的工具创建一个单页应用程序。唯一的要求是它必须在 GlassFish 服务器上本地运行（在 NetBeans 中：Java Web > Web 应用程序）。我使用 Facebook 提供的 create-react-app 入门工具包来构建应用程序。当我运行时，npm run build我得到一个包含 html 文件和 js 文件的构建文件夹。但是当我双击 html 文件时，浏览器会打开并且只显示一个空页面。有谁知道我必须配置什么才能获得一个捆绑的 html 文件，当我打开它时显示应用程序？

谢谢

4

1 回答 1

4

在您的 create-react-app 生成的代码上运行“ npm run build”后，它会显示帮助解决此问题的说明。它说的是：

You may also serve it locally with a static server:

npm install -g pushstate-server
pushstate-server build

第一个命令“ npm install -g pushstate-server”只需要运行一次，因为它将“pushstate-server”安装到全局 NPM。第二个命令 " pushstate-server build" 运行简单的静态服务器 pushstate-server，并在http://localhost:9000的 "build" 文件夹中提供任何内容。如果您愿意，可以通过在命令行末尾添加端口号来更改端口号：“ pushstate-server build 1234”

UDPATE：无服务器方法...

如果您的目标是从文件系统而不是从 Web 服务器运行页面，则需要调整build/index.html以修复 JS 和 CSS（以及不太重要的 favicon.ico）的路径。create-react-app 生成的 index.html 期望您的 JS 和 CSS 位于“/static/...”。但是，当您从文件系统打开时，该路径不正确。如果您删除前导正斜杠，使 URL 相对，您的页面将从文件系统正确加载：

运行“npm run build”后，打开生成的“build/index.html”文件。从“/favicon.ico”、“/static/js/main.[random string].js”和“/static/css/main.[random string].css”中删除前导斜杠并保存您的更改（所以所有人都读“静态/ ...”而不是“/静态/ ...”）。在浏览器中重新加载/刷新页面。

于 2017-01-24T18:52:01.373 回答