安装:npm i workbox-webpack-plugin -D
webpack.config.js引入
const WorkboxWebpackPlugin = require('workbox-webpack-plugin');
plugins中添加
plugins: [
new WorkboxWebpackPlugin.GenerateSW({
clientsClaim: true,//这些选项帮助快速启用
skipWaiting: true//不允许遗留任何“旧的”
})
]
entry入口js
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/service-worker.js').then(registration => {
console.log('sw注册成功了 ', registration);
}).catch(registrationError => {
console.log('SW注册失败 ', registrationError);
});
});
}
这是一项离线技术,适用于手机app,在没有网络,下不至于一片空白
注意
1、代码必须运行在服务器上
2、这项技术并不成熟,兼容性不友好
Chrome下,注册成功如图