create-react-app 在生产中显示我的所有代码，如何隐藏它？答案

【问题标题】：create-react-app is showing all my code in production, how to hide it?create-react-app 在生产中显示我的所有代码，如何隐藏它？
【发布时间】：2018-07-19 06:30:24
【问题描述】：

在我的 chrome 源选项卡中，我可以按确切的文件夹位置查看我的所有文件。我该如何隐藏它们？

这些不是我之前的项目中的问题，这些项目是在没有使用 create-react-app 的情况下制作的。

【问题讨论】：

你什么也做不了。这是一个功能

标签： javascript reactjs create-react-app

【解决方案1】：

根据Issue #1632，create-react-app 中的行为似乎是正确的。

Gaeron:

这是意料之中的。您可以从构建输出中删除 .map 文件，如果你想禁用它，虽然你会得到控制台警告他们失踪了。

在我看来，把它们留在里面并没有什么坏处。客户端代码已经对用户的机器可用，所以没有秘密它。

还要确保您有正确的生产版本，npm run build/yarn build 的输出应该部署到您的服务器。

如果您想完全禁用源映射的生成，请使用：

scripts: {
  "build": "GENERATE_SOURCEMAP=false react-scripts build"
}

您也可以通过.env 配置文件指定GENERATE_SOURCEMAP=false 参数或在纯控制台命令GENERATE_SOURCEMAP=false react-scripts build 中使用。

【讨论】：

只删除 *.map 文件并没有这样做。但是，注释掉 Service Worker 也起到了作用。
@SabbiuShah Service Workers 是 React 应用程序的重要组成部分，因为它们代表缓存、优化、快速加载和离线工作。请记住，不使用它们是一个巨大的缺点。
@SabbiuShah JS 代码始终可用，通常在生产构建中应该只有缩小的一个可用。尽管如此，不能保证有人不会窃取您的代码（因为这是客户端的特定情况）。如果你觉得你需要额外的保护，你可以考虑使用代码混淆，例如webpack-obfuscator。
@SabbiuShah 我只能猜测，因为我看不到您的服务器，但 *.map 可能会以某种方式被缓存，这就是为什么在删除它们后您仍然可以看到生产中的代码，但这并不确定.
是的！你是对的。在私人模式下访问网站时，内容现在没有显示......谢谢:)

【解决方案2】：

在package.json 文件中进行此更改，您就可以开始了。

scripts: {
  "build": "GENERATE_SOURCEMAP=false react-scripts build"
}

【讨论】：

【解决方案3】：

这里有三种隐藏代码的方法。

1.使用.env 文件。

GENERATE_SOURCEMAP=false

2。使用command 行。

GENERATE_SOURCEMAP=false react-scripts build

3.使用package.json

scripts: {
  "build": "GENERATE_SOURCEMAP=false react-scripts build"
}

【讨论】：

GENERATE_SOURCEMAP 的意义何在？为什么默认为True？

【解决方案4】：

或者你可以在 linux/mac 上使用GENERATE_SOURCEMAP=false react-scripts build

【讨论】：

这很有帮助！
GENERATE_SOURCEMAP 的意义何在？为什么默认为True？
我不久前向@dan_abramov 提出过这个问题，但没有得到答复。

【解决方案5】：

在 package.json 中（Windows）

"scripts": {
...
    "cleanBuild": "rimraf ./build/*",
    "build": "npm run cleanBuild && set \"GENERATE_SOURCEMAP=false\" && react-scripts build ",
...
}

【讨论】：

构建是做什么的：你能解释一下吗

【解决方案6】：

在上传到生产服务器之前删除所有 .map 文件（来自 js/ 和 css/ 文件夹）

【讨论】：

【解决方案7】：

在 package.json 中放入以下代码

scripts: {"build": "GENERATE_SOURCEMAP=false react-scripts build"}

More information follow this blog

【讨论】：

【解决方案8】：

我找到了一个非常简单的解决方案是：

npm run build nosources-source-map

有关不同方式的更多信息：这是link

【讨论】：

【解决方案9】：

您无法移除对代码的访问权限。您可以使用https://obfuscator.io 将headhash 提供给hacker 或code leecher。

【讨论】：

【解决方案10】：

在 Windows 机器上，这对我有帮助

"build": "set 'GENERATE_SOURCEMAP=false' && react-scripts build",

如果您使用的是react-app-rewired，您可以尝试以下方法。

我使用了一个名为cross-env 的包。它可以注入你的环境变量。

"build": "cross-env GENERATE_SOURCEMAP=false react-app-rewired build"

【讨论】：

【解决方案11】：

在 Windows 上，使用 package.json：

scripts: { "build": "set 'GENERATE_SOURCEMAP=false' react-scripts build" }

【讨论】：