时间戳

首页 > 解决方案 > 关于部署前端项目的困惑

javascript - 关于部署前端项目的困惑

问题描述

我是 Web 开发的新手，并且通过与 Firebase 和 Cloud Firestore 一起做一个小型 React 项目来学习 React。我使用的捆绑器是 Parcel。

据我了解，一个前端项目，在存在之后parcel build，所谓的生产就绪dist文件应该默认驻留在自动生成的文件夹中。我可以使用 firebase 来部署它。我确实做到了。但是，这是我在部署项目后遇到的一些问题。

  1. 我认为 Parcel 将通过将我拥有的所有 js 文件缩小到一个压缩的 js 文件来构建我的项目（除非我明确写parcel build index.html --no-minify）。所以部署的项目应该只附带一个 js 文件，而不需要将每个 React 组件的 js 文件传递​​给客户端的开销。但奇怪的是，我通过Sources从开发工具检查我部署的项目找到了所有的 js 文件。这是屏幕截图。在此处输入图像描述我对捆绑的理解是错误的吗？还是仅仅因为 Parcel 的配置已关闭？
  2. 我还通过从我部署的项目的开发工具中firebaseConfig.js检查找到了我的文件，其中包含我的项目的文件。我不知道这是否安全，我也不知道如何避免这种情况。考虑到我正在使用 Firebase 的 Web SDK，并且我没有为该项目设置自己的服务器，在这种情况下，这种暴露你的 appidKey 是不可避免的吗？Sourcesappid key
  3. 最后，在我之后Parcel build，我认为缩小的 js 文件会很小。但它们仍然很大。该.js.map文件几乎是 8 MB。这是正常的吗？在此处输入图像描述

标签： javascriptfirebasegoogle-cloud-firestorefrontend

解决方案

我发现我的 firebaseConfig.js 文件在那里，暴露你的 appidKey 是不可避免的/安全的吗？

正如Renaud Tarnec链接这个答案向公众公开 Firebase apiKey 是否安全？，从那个答案以及我的知识和以前的经验来看，是的，它是安全的，而且是不可避免的。将使用您的应用程序的用户将需要该配置来知道要连接到什么。

如果您想了解更多信息，可以阅读我对这个问题的回答，这与您对 API 密钥的问题类似，并且您可以看到没有办法只是“模糊”您拥有的 api 密钥那里https://stackoverflow.com/a/55196666/4229159

在我构建 Parcel 之后，我认为缩小的 js 文件会很小。但它们仍然很大。.js.map 文件几乎是 8 mb。这是正常的吗？

尽管我已经很长时间没有使用 parcel 阅读文档了，但NODE_ENV=production运行 build 命令时似乎您可能会丢失该标志

它应该看起来与此类似NODE_ENV=production parcel build entry.js

这也应该解决第一点的问题，即检查时文件过多。

即使parcel watch您在开发时用于提供文件，它也不会改变，最好让它们都像这样，未缩小且不丑化，这样当您的 HTML、JS 或CSS

此外，如果您正在开发，我建议您使用这种方式，一旦您在前端更改某些文件，它就会自动更新parcel watch。parcel build

推荐阅读