如何在index.html Angular 2中的src /目录中包含服务工作者js文件

时间:2017-12-01 18:14:06

标签: angular service-worker progressive-web-apps angular-service-worker

我正在尝试为Angular 2中的PWA设置一个服务工作者。我目前在src / assets / js中有service-worker.js文件,我可以在index.html中包含它以下:

<script>
if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('/assets/js/service-worker.js').then(function(registration) {
    console.log('ServiceWorker registration successful with scope: ', registration.scope);
  }).catch(function(err) {
    console.log('ServiceWorker registration failed: ', err);
  });
}
</script>

这个问题是我收到了错误

Uncaught (in promise) Error: Request for http://localhost:4200/assets/js/src/index.html?_sw-precache=5bad745861375765f6cd0b9440666847 returned a response with status 404

由于index.html不在/ assets / js / src,因此可以预料到这一点。如果我尝试将service-worker.js文件移动到src /我在js文件本身上出现404错误,因为我猜测Angular 2开发服务器没有把它拿起来?有没有人知道这方面的方法?

编辑:我正在使用angular-cli

1 个答案:

答案 0 :(得分:0)

service-worker.js文件移至src/并更改角度cli配置

<强> .angular-cli.json

"apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": [
        "assets",
        "favicon.ico",
        "service-worker.js" <==== add this
      ],