2

我们需要在我们的应用程序中部署一个自定义服务工作者（不是 Angular 服务工作者），并希望在应用程序中编写它，以便我们可以执行以下操作：

///... app.module.ts... simplified to get the idea
function registerServiceWorker() {
  if ('serviceWorker' in navigator) {
    // here I have the first problem: this filename is the file in my source
    navigator.serviceWorker.register('./service-worker.ts', {scope: `/${enviroment.BASE_PATH}/sw-test/`});
  }
}

@NgModule({
  //...
  providers: [{
      provide: APP_INITIALIZER,
      useFactory: registerServiceWorker,
      multi: true,
    },
  ]
})
public class AppModule {}

// ./service-worker.ts
// again this is a simplified example; it is a ts file because we are importing other ts files 
// like the environment file which is replaced by the correct version as part of the angular build
self.addEventListener('fetch', function(event) {
  event.respondWith(Promise.resolve('example').then(function (text){
    return new Response(text, { headers: {'Content-Type': 'text/plain' }});
  }));
});

我们遇到了一个问题：第二个文件没有包含在我们的构建中，并且要注册的字符串没有使用输出构建目录中的 .js 文件进行更新......

我在想如果我可以强制编译的输出是一个特定的名称，我可以这样做：

navigator.serviceWorker.register(`/${enviroment.BASE_PATH}/service-worker.js`, {scope: `/${enviroment.BASE_PATH}/sw-test/`});

但似乎没有任何方法可以触发 Angular 来构建我可以弄清楚的特定命名块。这是可能的，还是已经存在一些自定义构建器来执行此操作或有关如何编写内容的文档？

4

0 回答 0