reactjs - Create React App 生产构建成功,但生成的代码有错误
问题描述
我有一个我一直在使用 webpack-dev-server 开发的 create-react-app React 应用程序,并且一切都在开发中工作。
但是,当我为生产构建时,输出构建不起作用并且有以下控制台错误:
Uncaught SyntaxError: Unexpected token < :4001/static/js/1.33f1f515.chunk.js/:1
Uncaught SyntaxError: Unexpected token < :4001/static/js/main.625fef55.chunk.js/:1
Uncaught SyntaxError: Unexpected token < manifest.json:1 Manifest: Line: 1, column: 1, Unexpected token.
解决方案
您在生产环境中使用 express (nodejs) 服务器吗?
如果是,则检查静态文件服务配置。问题是/manifest.json
,/static/js/main.625fef55.chunk.js/
等正在返回 index.html 而不是清单或 js 文件。
这是我的示例服务器文件-
const express = require('express');
const path = require('path');
const app = express();
app.use('/', express.static(path.join(__dirname, '../build')));
app.use(function(req, res, next) {
//console.log(req.originalUrl);
next();
});
// to check if server is running
app.get('/ping', (req, res) => {
res.json({
success: true,
message: 'pong'
})
});
app.get('/*', function(req, res) {
res.sendFile(path.join(__dirname, '../build', 'index.html'));
});
module.exports = app;
推荐阅读
- dart - 如何在所有子组件中手动调用变更检测?
- git - 你可以吗?是否建议为 github 和 gitlab/gitbucket 使用相同的 ssh 密钥
- ruby-on-rails - Rails 应用程序出错:无法统计“/path/to/app/current/passenger_wsgi.py”:权限被拒绝(errno=13)
- javascript - React Native 组件样式的最佳实践
- android - 独立于使用的基本瓦片地图填充标记和折线。(用于 android 的 Leaflet 的替代品)
- c++ - C/C++:提取一个枚举的子集以形成一个新的枚举
- amazon-web-services - Kubectl get svc 命令抛出拒绝访问错误
- c# - 如何创建能够序列化为动态 json 对象(如 datatables.net 配置)的 c# 类?
- docker - Docker compose bind failed: port is already allocated
- asp.net-core - Where are the ASP.NET Core/.NET Core (preview 5) sources?