为什么节点模块在 firebase 模拟器上工作但在部署后不工作？

Question

我在使用 npm 安装的项目中使用 intl-tel-input。当我使用 Firebase 模拟器进行测试时，一切似乎都运行良好，但在部署后停止工作。

在 Chrome 开发工具中检查 Sources 选项卡后，我可以看到该模块未正确包含。 （请检查图片）但是，我完全无法弄清楚为什么。请帮忙！

Emulator Screenshot with the Telephone Input field working fine.

Screenshot taken post deployment with the Telephone input field broken.

Source File - intlTelInput.js located at /node_modules/intl-tel-input/build/css/intlTelInput.js

Source File - intlTelInput.css located at /node_modules/intl-tel-input/build/js/intlTelInput.css

Answer 1

默认情况下 Firebase ignores node_modules 部署时的目录。

您可以使用几个选项来解决此问题。

1. 使用 Rollup 或 Webpack 等构建工具生成包含节点依赖项的包。
2. 将所需的 node_modules 文件复制到不同的目录，例如 assets，然后从那里加载它们。
3. 更新 firebase.json 以在部署时不忽略 node_modules。请注意，如果您有任意数量的节点包，这可能会大大增加已部署应用程序的大小。