CRA(create- react -app)创建的react web总是重定向到'/‘
CRA (create-react-app) 是一个用于创建 React Web 应用程序的脚手架工具。它提供了一个简单的方式来初始化和配置 React 项目，使开发者能够快速开始构建应用程序。
当使用 CRA 创建的 React Web 应用程序总是重定向到 '/'，可能是由于以下原因之一：
- 路由配置问题：React Web 应用程序通常使用路由来管理不同页面之间的导航。如果应用程序的路由配置有误，可能会导致重定向到根路径。请确保路由配置正确，并且没有错误地将所有路径都重定向到根路径。
- 默认路由问题：CRA 默认使用 React Router 来处理路由。如果没有显式地定义其他路由规则，React Router 可能会将所有未匹配的路径重定向到根路径。您可以检查应用程序的路由配置文件，确保没有未处理的路径导致重定向。
- 服务器配置问题：如果您的应用程序部署在服务器上，服务器的配置可能会导致重定向到根路径。请确保服务器配置正确，并且没有将所有请求都重定向到根路径。
为了解决这个问题，您可以按照以下步骤进行排查和修复：
- 检查路由配置：查看应用程序的路由配置文件，确保没有错误地将所有路径都重定向到根路径。
- 检查默认路由设置：如果您使用了 React Router，确保没有未处理的路径导致重定向。您可以添加适当的路由规则来处理这些路径。
- 检查服务器配置：如果应用程序部署在服务器上，检查服务器的配置文件，确保没有将所有请求都重定向到根路径。
如果您需要更详细的帮助或进一步的指导，可以提供更多关于您的应用程序和环境的信息，以便我们能够更准确地帮助您解决问题。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云官网：https://cloud.tencent.com/
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
- 人工智能平台（AI Lab）：https://cloud.tencent.com/product/ai
- 物联网开发平台（IoT Explorer）：https://cloud.tencent.com/product/iotexplorer
- 移动应用开发平台（MPS）：https://cloud.tencent.com/product/mps
- 云存储（COS）：https://cloud.tencent.com/product/cos
- 区块链服务（BCS）：https://cloud.tencent.com/product/bcs
- 腾讯云元宇宙：https://cloud.tencent.com/solution/virtual-universe
相关·内容
1回答
我已经使用create- react -app创建了一个react应用程序，并且我正在为css使用less。我的应用程序构建正确，但在build/static文件夹中加载的文件较少
我使用带有react-app-rewired的customize-cra来为更少的文件添加一个加载器。
config-overrides.js文件
const {
override,
addLessLoader
} = require('customize-cra');
const path = require('path');
module.exports =
浏览 6提问于2021-03-25得票数 1
嗨，我最近意识到当CRA(npx create- React -app myapp)，serviceWorker从src文件夹中消失了，相反，我注意到reportWebVitals().Is有一些来自React的更新，它得到了serviceWorker，并用reportWebVitals取代了它？或者是我没有做正确的事情？请告诉我。谢谢
浏览 3提问于2020-11-16得票数 12
我用CRA创建了一个默认的react web并启动它。 并在地址栏中键入任意路径，如下所示。 http://localhost:3000/whatever/path 我期望“无法获取/无论什么/路径” 但是它总是重定向到'/‘ 为什么会发生这种情况？ 我该如何关闭这个重定向设置呢？
浏览 19提问于2021-04-04得票数 0
回答已采纳
我使用以下命令通过Create- React -App工具创建了一个React应用程序：
C:\Users\Valdo\Desktop\Test\React>npx create-react-app my-app
但是我遇到了一个错误，这是我的终端日志：
Creating a new React app in C:\Users\Valdo\Desktop\Test\React\my-app.
Installing packages.
This might take a couple of minutes.
Installing react, react-dom, and react-
浏览 1提问于2020-04-24得票数 0
所以为了解释一个问题，我在s3和CloudFront上托管了一个静态网站作为CDN。我已经使用create- react -app(CRA)为我的网站创建了react包。默认情况下，CRA会对webpack构建文件进行版本控制，这些版本也会出现在s3存储桶中。尽管如此，当我进行部署时，最新的变化还是没有出现(我甚至等了一天，希望它会出现)。我不确定是什么导致了这个问题。有谁能帮帮忙。 我已经添加了cloudfront behaviour选项卡的屏幕截图和具有构建版本的s3存储桶文件。 另外，如果这是浏览器缓存的情况，我如何禁用它，以便我的客户总是看到我的网站的最新版本。 ? ?
浏览 16提问于2020-08-14得票数 0
在一个创建-反应-应用程序中，在package.json中设置我的主页会得到我所期望的结果。我将其设置为: homepage：'/someUrl‘，在我的应用程序中，如果我的URL是localhost:3000/someUrl/另一个，并且我刷新了它，它将不会出现问题。 在我的非create- react -app应用程序中(它仍然是一个react项目，只是从头开始)，如果我通过正常方式导航到localhost:3000/someUrl/另一个，我会得到页面，但是如果我点击刷新，我会得到一个白色页面：Cannot GET /someUrl/another 有没有人见过这个？我正在尝试
浏览 8提问于2020-06-18得票数 0
我是React的新手，最近加入了一个团队，我的第一个任务是在不使用create- react -app的情况下设置一个react项目，因为正如团队负责人告诉我的那样，自定义模板使react更容易投入生产。然后，问题是如何使用create-react-app帮助我们完成所有的设置，如果我们想要定制CRA，我们可以使用npm run eject。那么，为什么我们要创建自己的模板呢？
浏览 0提问于2020-09-03得票数 0
3回答
我在3个不同的项目中使用了CRA，首先将用户发送到auth，然后根据一些信息将他重定向到X或Y。
它在生产环境(因为它们运行在同一个域上)上运行得很好，但是在dev、X和Y上无法对用户进行身份验证，因为它们运行在不同的端口(不同的域)上，本地存储中的数据不能在auth、X和Y之间共享。
我试图找到一种方法来使用反向代理(Http)在同一个域中托管React服务器，但也失败了，因为服务找不到资产/静态文件夹，导致404。也尝试了http-代理中间件，这是在CRA文档页面上推荐的，但是失败了。有没有更简单的方法让我看不到？
编辑:发现一些新的东西，但也失败了。使用react重新连接以覆盖CRA脚本
浏览 2提问于2019-08-22得票数 2
回答已采纳
我已经使用npx create- react -app task-tracker创建了react应用程序，这是我的package.json文件，每当我运行npm start时，它都会显示错误。因为我是新手，所以我对此几乎一无所知。这就是错误： npm ERR! missing script: start
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\ASUS\AppData\Roaming\npm-cache\_logs\2021-04-19T15_13_05_651Z-debug.lo
浏览 14提问于2021-04-19得票数 1
子应用的路由器不工作。 我将把4个独立的react应用程序合并到一个应用程序中。所以我生成了一个create- react -app(父应用程序)，并在父应用程序的src中找到了4个react应用程序。 父src中的App.js使用连接到子CRA的BrowserRouter。 子CRA也使用路由器移动到适当的url。 父服务器中的app.js。 function App() {
return (
<BrowserRouter>
<React.Fragment>
<Switch>
<Route exact path="
浏览 27提问于2019-06-19得票数 0
大家好，我在通过CRA(create- react - app )创建的react应用程序中观察到了这种奇怪的行为，其中我试图记录的控制台日志消息不一致，有时根本不记录。这是我的代码
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import './index.css';
class Dynamic extends Component {
constructor(props) {
super(props);
this.s
浏览 0提问于2019-01-18得票数 0
npm ERR! cb() never called!
npm ERR! This is an error with npm itself. Please report this error at:
npm ERR! <https://github.com/npm/cli/issues>
npm ERR! A complete log of this run can be found in:
npm ERR! /home/abhijith/.npm/_logs/2021-05-12T16_20_42_200
浏览 3提问于2021-05-12得票数 0
我是react编程的新手。我使用create- react -app命令创建了一个react应用程序。为了生成构建，我运行npm run build命令(react-scripts build)。我的应用程序的构建大小是2.5MB，我想减少应用程序的大小。我查了一下，发现有人在用webpack和gzip插件来缩小应用的大小。但是，如果您使用create- react -app命令生成react应用程序，那么除非npm运行eject，否则我们无法看到webpack的配置。那么，有没有办法将gzip压缩添加到我的react web应用程序中呢？
浏览 27提问于2020-10-08得票数 0
回答已采纳
1回答
我已经启动了一个新的create- React -app ( CRA )项目来替换一个没有使用CRA的现有React项目。这个项目使用的是TypeScript，而我的集成开发环境是WebStorm。 我的package.json文件包含devDependencies中的以下模块： "@types/react": "~16.9.50",
"@typescript-eslint/eslint-plugin": "~4.3.0",
"eslint": "6.6.0",
"eslint-confi
浏览 25提问于2020-10-19得票数 1
我想提供2个不同的反应应用程序在子文件夹中使用S3 +云前线
myapp.com/app-one/ <--这是index.html
myapp.com/app-two/ <--这是另一个index.html
我知道如何配置create- react -app和react路由器来处理这个问题。
问题出在配置S3 + Cloudfront来处理重定向。
在浏览器中输入url时：
myapp.com/app-one/some-route -它应该重定向到app-one的index.html
myapp.com/app-two/some-route -它应该重定向到app-two的ind
浏览 0提问于2020-02-08得票数 4
我正在创建一个电子，它运行由create- react -app生成的react。然后我添加了nedbjs(持久化数据库)和camojs(nedb的ODM)作为依赖项。为了连接react和nedb，我使用了电子ipc。
下面是我的项目结构：
下面是我的package.json：
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react
浏览 0提问于2017-07-30得票数 13
1回答
我试图下载基本的react-app模板，但我遇到了一些问题。在我的“命令提示符”(windows终端)中，我执行了以下操作：
C:\Users\Danja>npm -v
6.14.8
以下是我的节点版本：
node -v
v14.15.0
然后我安装了react：
npm install -g create-react-app
C:\Users\AppData\Roaming\npm\create-react-app -> C:\Users\AppData\Roaming\npm\node_modules\create-
react-app\index.js
+ create-r
浏览 0提问于2020-11-08得票数 1
我正在为CRA(create- react -app) react项目创建SSR服务器。但是，当我执行'npx webpack‘时发生了一个错误。 这是我的目录树的图片。My file directory server.js import React from 'react';
import {renderToString} from "react-dom/server";
import express from 'express';
import App from '../src/App.js';
const do
浏览 60提问于2020-07-12得票数 5
我已经使用create- react -app工具创建了react-js应用程序，当我调用web时，我有.net核心web，每次我想要避免重复使用' localhost ://7000‘时，我都必须做一些像fetch(’localhost://7000/ api / using‘)这样的事情，所以有没有办法配置react- js应用程序，这样当我使用web时，我就可以避免在每个文件中使用这个localhost字符串？
浏览 14提问于2019-08-09得票数 0
回答已采纳
我需要弄清楚create- react-native -app然后分离和react-native init之间的区别。
据我所知，前者将基于世博会创建一个应用程序，后者需要分离以公开android和iOS的本机代码以实现本机代码。react-native init将同时生成本地代码。
使用create- react-native -app命令创建expo后脱离expo和react-native init有什么不同吗？
浏览 1提问于2018-06-08得票数 0
这就是问题所在
HP@桌面-1HP83V8 MINGW64 ~/Desktop/Web-开发(主)$ npx创建反应-应用程序my-app
在C中创建一个新的React应用程序：\User\HP\Desktop\Web-Development\my- app。
安装软件包。这可能需要几分钟。
安装react，react dom，和react脚本与cra-模板.
npm错误！cb()从来没有打过电话！
npm错误！这是npm本身的一个错误。请在以下位置报告此错误：
npm错误！
npm错误！可以在以下位置找到此运行的完整日志：
npm错误！C:\Users\HP\AppData\Roaming
浏览 12提问于2020-11-20得票数 5
开箱即用jest的create-react-app总是失败
我所做的步骤
create-react-app cra-test
cd cra-test
yarn install
将package.json中的原始test更改为
{
"name": "cra-test",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.2.0",
"react
浏览 0提问于2018-03-22得票数 8
C:\Users\Price Charles>npx create-react-app larotiks
在C:\Users\Price Charles\larotiks中创建一个新的React应用程序。
正在安装程序包。这可能需要几分钟的时间。正在使用cra模板安装react、react-dom和react脚本...
我正在创建我的react项目，但它总是停留在这里，无法继续创建我的项目。请帮帮我
浏览 1提问于2020-06-20得票数 0
在开发大型React应用程序时，哪个是更好的选择？使用create- react -app和它提供的默认的webpack和巴别塔配置，还是创建一个自定义的webpack和巴别塔配置并安装react包？ 我已经使用create- react -app在react中开发了一些小应用程序，现在我想了解从webpack和巴别塔开始的每一个小部分。大公司是使用webpack和巴别塔，还是简单地创建反应应用？
浏览 12提问于2020-04-10得票数 0
我第一次尝试在本地机器上创建一个react应用程序。我已经成功地使用'npm I -g create- react - app‘全局安装了' create -react-app’，安装后，当我尝试使用'create-react-app‘创建一个react应用程序时，它创建了该应用程序的文件夹，其中只有两个文件，这两个文件是the items within the created folder，但是，终端显示以下错误： Error: Cannot find module 'cra-template/package.json'
Require stack:
浏览 9提问于2021-09-05得票数 1
2回答
我正在使用create- React -app，react-redux，react-thunk，react-router创建一个react应用程序。
我在认证后设置了一个本地存储变量"current_user“，这样我就可以设置我的受限路由器了。
我使用Axios发出ajax请求，并且在我的初始index.js文件中设置了一个全局Axios拦截器，以便如果任何ajax调用返回401，它将自动清除本地存储"current_user“。我希望它也能重定向到/Login。
我可以用老式的方法(即window.location)来做这件事，但是，有没有办法将这个全局函数设置为从应用程序
浏览 6提问于2018-01-18得票数 3
React路由器(使用React路由器-dom) /，/about，/contact
快速路由器/ =>呈现反应构建的index.html
为了防止“无法获得/about，/contact"，我这样编码。
即使是CRA代码也与我的()相同。
但问题是当我想直接获得"“时，它会因为代码而重定向到"”。
我能做什么?
// rendering react
app.get("/", function (req, res) {
res.sendFile(__dirname + "/client/build/index.html");
浏览 2提问于2020-06-18得票数 1
我使用create- React -app命令创建了一个基本的react应用程序，并将其部署到Google Cloud(App Engine)。在GCP上为我的应用程序添加身份验证的选项有哪些？我想让用户登录之前，他们的谷歌电子邮件帐户能够使用该应用程序。
浏览 11提问于2019-10-14得票数 1
回答已采纳
我已经安装了nodejs，然后我尝试使用npx创建- react app我的应用程序创建react is app，但是它只是停留在安装react dom，cra-模板上，然后我也尝试了npm，但是它也是一样的，请帮助学习react，请帮助我有节点版本16.13.2。和npm版本8.1.2
PS D:\Programming\React Js> npx create-react-app firstapp
Creating a new React app in D:\Programming\React Js\firstapp.
Installing packages. This migh
浏览 6提问于2022-01-29得票数 0
1回答
我正在开发一个使用create- React -app创建的react web-app (https://timatorg.is -以防有人想要查看响应头)。在创建它的时候，默认情况下注册了一个服务工作者，我并没有太多地考虑它。该应用程序托管在Netlify上，DNS位于Cloudflare。 现在，当将更新部署到网站时，以前访问过该网站的用户总是得到相同版本的应用程序，我非常确定这是因为服务人员。但奇怪的是，引起问题的不是"https://timatorg.is“，而是"https://www.timatorg.is”。 我读了很多关于如何注销已经缓存的服务工作者的资料，但
浏览 6提问于2019-03-21得票数 2
我有一个用create- React -app创建的react项目，它连接到一个web，这个应用程序必须安装在本地的多个客户端上，所以每个客户端的EndPoints都会改变，为了避免这样的事实，如果我必须在每个客户端上重新编译项目，我希望能够有一个单独的文件，在那里我可以更改这个URL。
浏览 22提问于2021-07-22得票数 0
我无法通过create- react -app创建react应用程序，它会给我一个错误 ?
浏览 20提问于2019-05-29得票数 1
回答已采纳
3回答
在VSCode中打开类型记录项目会导致错误"ts2307无法找到模块'react‘或其相应的类型声明“。但Webstorm很好用。我从CRA创建了repo，这是一个类型记录模板。节点通过nvm安装。我这里用的是纱3.2.3，我还没有弹出CRA。
package.json
{
"name": "frontend-ts",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-li
浏览 8提问于2022-09-10得票数 1
我正在尝试创建一个自定义的cra模板文件供我的团队使用，但是在运行npx create-react-app test-app --template my-custom-template时，我仍然会遇到一个问题，即我收到了以下错误。
internal/modules/cjs/loader.js:796
throw err;
^
Error: Cannot find module 'cra-template-my-custom-template'
Require stack:
- C:\Users\user\Desktop\cra-test-app\test-ap
浏览 2提问于2020-04-10得票数 11
回答已采纳
4回答
我需要重定向到一个在Netlify上的react项目的家，但是我使用的是vite。
我曾经使用CRA (Create)和在公用文件夹中创建_redirects文件来实现这个配置。
/* /index.html 200
我该怎么做呢？
浏览 11提问于2022-05-13得票数 3
我用vite.js做了一个react构建。在本地主机上构建生产和测试时，一切工作正常。但是当我部署到Netlify或vercel时，我用react-router创建的路由不能通过直接输入它们的url来访问，而只能通过使用应用程序内部的链接从主页('/')访问。 如果我点击应用程序中的路由链接，路由是有效的，但是如果我直接输入url (例如: mypage/about)，我会得到一个404错误。 我查看了vercel支持，他们说配置中可能缺少重定向，例如，默认情况下由create-react-app设置。在CRA中，它看起来像这样 {
"redirects: [
浏览 47提问于2021-03-17得票数 2
无法编译react.js代码。在第7行出现错误。下面是我的代码和错误。我已经通过create- react -app创建了react应用程序。
import { Navbar, NavbarBrand } from 'reactstrap';
import Menu from './components/MenuComponents';
import './App.css';
import { DISHES } from './shared/dishes';
function App() {
constructor(pr
浏览 0提问于2021-01-16得票数 1
将express服务器代码和API密钥放在CRA项目根目录中并静态地提供build文件夹是否安全？
在构建过程中，CRA是否复制或包含除/public和src以外的任何其他文件或目录中的内容？例如，在此过程中：
> npx create-react-app react-app
> cd react-app
> npm install
> npm install express
然后创建react-app/server.js和react-app/config.js -并在config.js中包含API密钥，server.js将提供react-app/build/目录中的前
浏览 3提问于2021-09-02得票数 0
我刚刚通过"npx create- React - App“创建了react app，然后当我执行"npm install redux”或"npm install --save-dev redux“或"npm install --save redux”时，它并没有修改package.json 我用"react-redux"，“react-thunk”做了同样的事情...但还是..。package.json保持不变。 我不知道如何解决这个问题。求求你帮帮我。 "name": "basic_redux_setup"
浏览 18提问于2021-01-12得票数 0
回答已采纳
我有一个monorepo与react-native for mobile和react for web。当我使用"react-app-rewired build“时，我得到了以下错误： node_modules/@react-navigation/core/lib/module/getStateFromPath.js
Attempted import error: 'parse' is not exported from 'query-string' (imported as 'queryString'). 很明显，导入/导出出了问题，但
浏览 123提问于2021-05-04得票数 1
1回答
我已经使用create- react -app npm模块创建了一个示例react应用程序。然后，我将hello.js添加到应用程序中，以便能够使用此api编写快速应用程序。我已经在facebook developer站点上正确地配置了我的应用程序id等(我已经在没有使用hello.js的情况下用另一个示例应用程序进行了测试，它工作得很好)。
当我点击Login按钮时，它被重定向到FB登录页面，我输入了正确的凭据，它被重定向到localhost，但没有成功响应。由于某些原因，这不起作用。我不知道哪里出了问题。
如果有人知道我做错了什么，下面是代码：
import React, { Compon
浏览 9提问于2016-08-21得票数 1
回答已采纳
在反应本机web应用程序中尝试使用@react-本机选择器/选择器时，会引发以下错误。
package.json依赖项包括：
"@react-native-picker/picker": "^1.16.1",
"babel-plugin-react-native-web": "^0.17.0",
"customize-cra": "^1.0.0",
"react-app-rewired": "^2.1.8"
"react": "16.9.0&#
浏览 3提问于2021-06-18得票数 1
当我在终端中输入npx -create- react app以创建我的app项目时，这会告诉我npx命令找不到?。
浏览 8提问于2022-07-27得票数 0
我想知道如何启动使用https中的create- react -app命令创建的react应用程序，而不是HTTP？
浏览 17提问于2019-01-31得票数 3
回答已采纳
我正在尝试使用npx create-react-app my-first-react-app创建一个新的React应用程序项目 我收到一个错误- $ npx create-react-app my-first-react-app
npx: installed 67 in 43.776s
Creating a new React app in C:\Users\myid\my-first-react-app.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and
浏览 39提问于2021-01-12得票数 0
在使用create- react -app创建react应用程序时，我收到错误：
C:\Users\NidaZehra\Desktop\React>create-react-app demo1
Creating a new React app in C:\Users\NidaZehra\Desktop\React\demo1.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
npm ERR! Maximum call
浏览 6提问于2019-07-23得票数 1
我只是运行npx create-react-app my-app并得到以下错误：
Creating a new React app in D:\Other computers\My Laptop\Programming [P]\Web Development\Projects\my-portfolio\my-app.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...
npm ERR! cod
浏览 0提问于2021-09-14得票数 0
5回答
我已经使用create- react -app创建了一个react应用程序。我想在构建期间对文件进行gzip压缩。
我希望这些文件是gziped的。
浏览 0提问于2019-05-17得票数 10
我目前有两个独立的前端应用程序。一个轻量级移动客户端和一个重量级管理面板。两者都是使用CRA创建的。我们所有的东西都使用TypeScript。
目前目录结构如下：
root
├── admin (created using create-react-app)
| ├── node_modules
| ├── public
| ├── src
| │ └── common (symlink)
│ │ └── index.ts
| ├── package.json
| └── tsconfig.json
├── mobile (created using cre
浏览 4提问于2020-09-14得票数 3
我正在使用react原生web设置web应用程序。我想为UI组件使用本机基础，但无法在web中使用它。我已经遵循了这个指令https://github.com/GeekyAnts/NativeBase-KitchenSink/tree/web-support 因为这是关于图书馆的官方信息。 我使用下面的命令yarn create react-app test-web --typescript创建web应用程序 然后添加纱线添加react-native@0.55.4 react-native-web@0.10.0 react -art@16.8.2纱线添加-D @types/react-nat
浏览 7提问于2019-03-13得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
