在您的项目中快速添加 swpp 支持

  在本章之中，您将了解如何安装、使用 swpp。

结构介绍

  swpp 将实现分为了前端实现和后端实现，其中后端实现是唯一的，而前端实现在不同平台会有不同的实现。

  swpp 对前端的具体实现没有太多限制，所以前端实现的安装、使用方法请阅读其提供的文档。下文中将为您介绍后端的安装、使用方法。

  下面是已知的前端实现：

安装

  在项目中安装 swpp 后端非常简单，只需要运行下面的指令即可：

npm install swpp-backends@3

创建配置文件

  swpp 支持以下类型的配置文件：ts js mts cts mjs cjs。

  配置文件的文件名及所在路径请见您使用的前端实现的文档，此处我们假设配置文件名称为 swpp.config.ts。

  接下来需要在其中填入下面的内容（注意将 DOMAIN_HOST 替换为您的 host）：

import { defineConfig } from 'swpp-backends';
 
defineConfig({
    compilationEnv: {
        // 此项是必须配置的项目，swpp 必须知道您的域名才能区分哪些资源是外部资源。
        // 部分前端实现可能会帮您自动填写该项目，具体是否必须手动填写请见前端实现的文档。
        DOMAIN_HOST: new URL('https://www.example.com')
    }
})

  此时您就完成了配置 swpp 所必须的步骤。

注意事项

• swpp 生成的 Service Worker 文件中的代码未经压缩，会包含很多无用字段，所以会非常臃肿，请注意使用压缩器压缩 js 的内容。
• 目前 swpp v3 还处于测试阶段，所以请注意留意启用 swpp 后网站是否会工作异常（尤其是与缓存功能相关的）。
• 请注意追进 swpp 的版本更新。