stenciljs 学习十一 pwa 支持

2024-04-04 23:43:47

stenciljs 对于pwa 的支持是自动注入的，我们只需要简单的配置，stenciljs使用workbox

配置

默认配置

{

  skipWaiting: true,

  clientsClaim: true,

  globPatterns: [

    '**/*.{js,css,json,html,ico,png,svg}'

  ]

};

修改配置

使用 stencil.config.ts 配置

export const config: Config = {

  outputTargets: [

    {

      type: 'www',

      serviceWorker: {

        globPatterns: [

          '**/*.{js,css,json,html,ico,png}'

        ]

      }

    }

  ]

};

自定义service worker 配置

修改配置的swSrc

export const config: Config = {

  outputTargets: [

    {

      type: 'www',

      serviceWorker: {

        swSrc: 'src/sw.js'

      }

    }

  ]

};

书评

使用脚手架工具可以帮助我们生成一些默认配置，还是很方便的

参考资料

https://stenciljs.com/docs/service-workers
https://github.com/ionic-team/stencil-site

最新文章

热门文章