使用 node express 的 create-react-app 获取 %PUBLIC_URL%

Posted

技术标签:

【中文标题】使用 node express 的 create-react-app 获取 %PUBLIC_URL%【英文标题】:create-react-app with node express getting %PUBLIC_URL% 【发布时间】:2017-12-05 08:56:48 【问题描述】:

我正在尝试使用 express 服务器创建-react-app。在我点击请求时设置服务器后,我得到了

GET http://localhost:3333/%PUBLIC_URL%/favicon.ico 400 (Bad Request)

在错误预览它给我

URIError: Failed to decode param '/%PUBLIC_URL%/favicon.ico'
    at decodeURIComponent (<anonymous>)
    at decode_param (/home/owaishanif/code/flashcard-app/node_modules/express/lib/router/layer.js:172:12)
    at Layer.match (/home/owaishanif/code/flashcard-app/node_modules/express/lib/router/layer.js:123:27)
    at matchLayer (/home/owaishanif/code/flashcard-app/node_modules/express/lib/router/index.js:574:18)
    at next (/home/owaishanif/code/flashcard-app/node_modules/express/lib/router/index.js:220:15)
    at jsonParser (/home/owaishanif/code/flashcard-app/node_modules/body-parser/lib/types/json.js:103:7)
    at Layer.handle [as handle_request] (/home/owaishanif/code/flashcard-app/node_modules/express/lib/router/layer.js:95:5)
    at trim_prefix (/home/owaishanif/code/flashcard-app/node_modules/express/lib/router/index.js:317:13)
    at /home/owaishanif/code/flashcard-app/node_modules/express/lib/router/index.js:284:7
    at Function.process_params (/home/owaishanif/code/flashcard-app/node_modules/express/lib/router/index.js:335:12)

这是服务器代码

var express = require('express');
var bodyParser = require('body-parser');
var path = require ('path');

var data = ;

express()
    .use(express.static(path.resolve(__dirname, '..', 'public')))
    .use(bodyParser.json())

    .get('/api/data', (req, res) => res.json(data))

    .post('/api/data', (req, res) => res.json(data = req.body))

    .get('*', (req, res) => res.sendFile( path.resolve( __dirname, '..', 'public/index.html')))

    .listen(3333, function()
        console.log('server running at 3333');
    );

我想用服务器创建反应应用程序。网上有文章,但是已经过时了。欢迎提供帮助提示和技巧。

【问题讨论】:

你能发布你的前端代码吗?我认为前端有问题 @Burdy 我不是问题作者,所以我不能发布前端。在本地我有一个最简单的 - 只是默认页面注意更多。 我已经使用 create-react-app build 解决了这个问题,它创建了一个构建文件夹。和其他文件。 【参考方案1】:

我已经使用create-react-app build 解决了这个问题,它创建了一个构建文件夹。 %public_url% 字符串也被幕后的一些纱线脚本所取代。所以我们不能直接提供那个文件夹。相反,我们必须使用build 生成。

使用yarn buildnpm run build。这将生成一个包含assetmanifest 和其他文件的构建文件夹。

之后,使用该构建文件夹静态提供您的文件以供生产使用。

【讨论】:

没错。服务器应该从你运行 npm run build 后生成的 dist 文件夹中返回文件。

以上是关于使用 node express 的 create-react-app 获取 %PUBLIC_URL%的主要内容,如果未能解决你的问题,请参考以下文章

Node: 使用Express脚本库搭建本地的Web服务器

Node.js - 在终端中显示 ESLint 错误,如 create-react-app

Node.js(Express API):req.body.myobject 未定义且无法正常工作

create-react-app + nodejs (express) 服务器

从 Node.JS 中的未捕获异常中恢复

从 Node.JS 中的未捕获异常中恢复