webpack.config.js
const WorkboxWebpackPlugin=require('workbox-webpack-plugin');
//终端下载npm i workbox-webpack-plugin -D
plugins:[
new WorkboxWebpackPlugin.GenerateSW({
//1.帮助serviceworker快速启动
//2.删除旧的serviceworker
clientsClaim:true,
skipWaiting:true
})
]
index.js
注册serviceWorker
处理兼容性问题
//serviceWorker 注意首字母大写
if('serviceWorker' in navigator){
window.addEventListener('load',()=>{
navigator.serviceWorker
.register('/service-worker.js')
.then(()=>{
console.log('sw注册成功了‘)
})
.catch(()=>{
console.log('sw注册失败了’)
});
});
}
1.eslit不认识window,navigator全局变量
2.serviceworker代码必须运行在服务器上
--->nodejs
npm i serve -g //serve可以帮我们快速创建一个静态资源服务器
serve -s build 启动服务器,将build目录下所有资源作为静态资源暴露出去
package.json
"eslintConfig":{
"extends":"airbnb-base",
"env":{
"broser":true
}
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)