Как добавить Google Workbox в проект Angular?

Question

Я пытаюсь использовать Google Workbox в своем проекте, но пока нет текущих руководств и руководств по шагам, чтобы заставить рабочий ящик работать с новым угловым проектом.Есть ли у кого-нибудь понимание или ресурсы о том, как это делается, поскольку angular использует машинописный текст вместо прямых js?Например, мастер рабочего ящика работает с угловым проектом или мне нужно сделать что-то особенное?

Answer 1

У вас есть много способов использовать Workbox в вашем проекте Angular

Если вы используете веб-пакет, вы можете легко создать работника сервиса с workbox-webpack-plugin, все подробности о том, как его использовать, подробно описаны здесь .Вы можете использовать GenerateSW для генерации работающего сервисного работника, кэширования во время выполнения и т. Д. Существует также плагин InjectManifest для создания манифеста предварительного кэширования и внедрения его в ваш собственный сервисный работник.

Кстати, есливы предпочитаете писать свои собственные, а не использовать плагины, вы все еще можете написать своему сервисному работнику с прямым js в своем проекте Angular и использовать Angular ServiceWorkerModule, чтобы зарегистрировать его в своем приложении с помощью функции register() (этодолжно быть сделано внутри массива imports вашего основного модуля Angular).Вам также необходимо импортировать библиотеку workbox в сервисный работник с помощью importScripts('https://storage.googleapis.com/workbox-cdn/releases/3.6.2/workbox-sw.js');

Я никогда не использовал мастер workbox, поэтому не могу рассказать вам больше об этом, но вышесказанное должно помочь.