-1

我正在使用 Angular 和 Firebase 制作 PWA。使用 StackBlitz 进行开发。

当用户在浏览器中打开我的应用程序时，我想让“添加到主屏幕”Chrome 标准建议起作用，但我无法从我的代码中正确调用“服务工作者”JS ...

我在项目的 /src 文件夹中创建了 sw.js。我已将其添加到 .angular-cli.json 和 .angular.json 中的“脚本”和“资产”部分。在 StackBlitz 中一切正常！

但是当我将项目部署到 Firebase（使用 Stackblitz 内置功能）时，没有任何效果......似乎服务器在预期的目录（/src/sw.js）中看不到文件......有人遇到同样的问题吗？

4

1 回答 1

0

我认为没有办法解决它，我很确定问题出在 stackblitz 服务器上。但幸运的是，firebase 工程师制作了一个简单的节点脚本来替换单个文件。它对我有用。如链接所述，只需安装 git 和节点，然后在命令提示符下运行以下命令：git

  1. git clone https://gist.github.com/e00c34dd82b35c56e91adbc3a9b1c412.git firebase-hosting-deploy-file
  2. cd firebase-hosting-deploy-file
  3. npm 安装
  4. 然后将您的javascript文件添加到它在stackblitz中的同一文件树中，对我来说它在src/assets/scripts/alert.js中，所以我创建了一个带有脚本文件夹的资产文件夹，里面有我的js文件。在 firebase-hosting-deploy-file 目录中执行所有这些操作。
  5. 在提示符下运行：“node deployFile.js [commit]”，对我来说，我的文件结构是“node deployFile.js otherproject-a5722 /assets/scripts/alert.js commit”

附加信息：

我尝试复制您的问题，如果链接有效，请告诉我。https://stackblitz.com/edit/angular-epvm8w。基本上就在 index.html 中。js 文件只有 alert("alert"); 在里面。它像你说的那样工作，但部署时我认为 stackblitz 服务器正在用 html 替换内容。我认为这是因为在源代码下的 chrome 开发人员面板中，js 文件与来自 stackblitz 的 github 的索引模板具有相同的 html。让我觉得这只是一个错误。css文件也发生了同样的事情。

于 2019-11-03T20:37:01.327 回答