React 应用程序在 localhost 中运行良好，但在服务器上构建并在本地构建时显示错误答案

【问题标题】：React app is working perfectly in localhost, but shows an error when building on server and doing build locallyReact 应用程序在 localhost 中运行良好，但在服务器上构建并在本地构建时显示错误
【发布时间】：2021-10-27 02:15:49
【问题描述】：

所以我的 react 应用程序在一开始就可以完美运行。我重新组织了文件夹结构并重命名了一些文件以使其更干净。之后，它现在可以在 localhost 中完美运行，但是当我尝试在 AWS 中构建它时出现错误：

纱线运行 v1.22.15 $ react-scripts build && aws s3 sync build/ s3://$FRONTEND_S3 && aws cloudfront create-invalidation --distribution-id $CF_DIST_ID --paths '/*' 创建优化的生产版本...

编译失败。 ./src/components/reports/inventoryVarianceSummary/accounts/InventoryVarianceAccountStores.js 找不到文件 '../../../modal/inventoryVarianceSummary/ExportTableAccountStores' 在 './src/components/reports/inventoryVarianceSummary/accounts'。

error 命令失败，退出代码为 1。 info 访问 https://yarnpkg.com/en/docs/cli/run 获取相关文档命令。

我尝试在我的电脑上执行 npm run build 然后它显示错误

前端@0.1.0 构建反应脚本构建

正在创建优化的生产版本...编译失败。

src\components\reports\inventoryVarianceSummary\accounts\InventoryVarianceAccountStores.js 第 268:14 行：未定义“ExportTableClassificationStores” 反应/jsx-no-undef

搜索关键字以了解有关每个错误的更多信息。

这些文件是我移动/重命名的文件之一，现在它显示错误。我仔细检查了文件路径，它是正确的。该应用程序在 localhost:3000 中完美加载。

另一个奇怪的事情是，当我导航到给定行时，在 npm run build 上显示的 ExportTableClassificationStores 是 ExportTableAccountStores。所以好像没有更新？但随后 AWS 错误显示 ExportTableAccountStores 并且仍然找不到它...

有什么帮助吗？我尝试运行 npm cache verify 但它不起作用。

【问题讨论】：

标签： reactjs

【解决方案1】：

此错误可能不止一种情况发生，但一般情况下，您需要检查以下几点：

请检查 File.js 名称是否正确，其调用是否正确，例如： import File from "File" 不是 import File from "file"
请确保您没有从两个不同的模块两次导入同一个模块，例如： import Menu from "Modle1/Menu"; import Menu from "./Modle1/Menu";
可以直接导入模块而不加载默认导出，例如： import "module" 嵌套在 import Module from "./Module"
由于您正在移动/重命名文件，因此请确保路径不会更改到错误的位置或一直指向旧位置，例如： import Module from "../A/B" 并在移动其 "../../A/B" 之后，但实际上它必须是 "../../../A/B"
确保不会溢出导入模块，例如： import module from "Module" 会出错，一定是import Module from "Module"
一定要导入默认导出，但是有些模块没有默认导出，所以你必须确定你需要包含哪个模块，例如： import M from "Module"最多的是：import {M} from "Module";

并确保检查文件夹/文件名的拼写是否正确，并且您的导入也正确！任何缺少的大写字母或小写字母都可能会导致意外错误。并在此之后检查 CamelCase 规则..

注意：这种情况有时会发生在不同的操作系统之间，例如 windows 不像 windows ......因此上述检查将解决问题

【讨论】：

也许这可能会有所帮助，但我认为这是因为我更改了仅包含大小写的文件夹或文件名...就像我将文件夹 InventoryVariance 更改为inventoryVariance camelcase...无论如何要解决这个问题？
是的，你需要检查你的导入是否写成 folderName ...import X from "./inventoryVariance" 嵌套的 "./InventoryVariance"...我认为这将解决问题。

【解决方案2】：

编辑：发生这种情况是因为我不小心重命名了文件和文件夹。你应该使用：

git mv

如果您想移动/重命名文件。问题是我用大写字母重命名了一些文件但名称相同（例如... fooBar.js 到 FooBar.js），你应该用 git mv 重命名它

【讨论】：