React 添加 "build" 到基数 url 的末尾

Question

我正在使用 create-react-app 创建一个基本的 React 应用程序。当我 cd 进入根文件夹和运行 npm run start 或 yarn start 时，项目 url 是 http://localhost:3000/build.

为什么要在 url 末尾添加 build 以及如何让服务器加载 http://localhost:3000/？

Answer 1

在项目文件夹根目录的 package.json 下（使用 create-react-app 创建应用程序后产生的文件夹）有 scripts定义。

在那里你可以看到当你运行 npm run start 或 yarn start -> "react-scripts start"

时执行的内容

顺便说一句，您可以 npm start - 不需要 npm run start 因为它是第一个脚本 ;)

那么这些反应脚本在哪里以及调用了什么？

嗯，在同一个根文件夹中，你的 npm 模块文件夹名为 node_modules。经过大量滚动后，其中肯定有一个 react-scripts 子文件夹，其中有一个名为 scripts 的文件夹，其中有一个名为 start.js。这就是实际得到的运行.

这个区块

const urls = prepareUrls(
      protocol,
      HOST,
      port,
      paths.publicUrlOrPath.slice(0, -1)
    );

我相信，确定 URLs 并且因为它将这些部分粘合在一起，所以端口后面的部分很有趣：

paths.publicUrlOrPath.slice(0, -1)

路径对象定义于（从我从一开始就用作参考的同一个应用程序根路径中查找） node_modules\react-scripts\config\paths.js

在此文件中，这段代码恕我直言，确定了您之后的路径：

const publicUrlOrPath = getPublicUrlOrPath(
  process.env.NODE_ENV === 'development',
  require(resolveApp('package.json')).homepage,
  process.env.PUBLIC_URL
);

所以你在 Node 或 OS 级别摆弄了 process.env.PUBLIC_URL，我不是系统管理员 ;)

好歹送你一张“免狱”卡：

在 package.json 文件中（是的，前面提到的项目根目录中的文件）在“名称”：“应用程序”或您的应用程序命名后添加另一行：

"homepage": "",

这将强制 require(resolveApp('package.json')).homepage, 发挥作用并将其用作 URL 的最后一部分。

React 添加 "build" 到基数 url 的末尾

React adding "build" to end of base url

reactjs

create-react-app