1
나는 내 애플리케이션의 서비스 작업자를 생성하기 위해 잡동사니 작업 러너와 함께 workbox 빌드를 사용하고 있습니다. 나는 서비스 워커를 생성하려고했지만 작동하지 않았다. 아래 코드 스 니펫을 찾으십시오 workbox-build와 grunt task runner를 통합 할 수있는 자습서 나 코드 스 니펫이 있습니까?Workbox with grunt
작업 구성.
grunt.registerTask('generateSW', function() {
grunt.log.writeln("Generate SW",__dirname);
workboxBuild.injectManifest({
swSrc: path.join(__dirname,'frontend','serviceWorker.js'),
swDest: path.join(__dirname,'frontend','serviceWorker.js'),
globDirectory: './build/public/',
globPatterns: ['**\/*.{html,js,css}'],
injectionPointRegexp: /(\.precacheAndRoute\()\s*\[\s*\]\s*(\))/,
staticFileGlobs: [
'./build/public/scripts/*.js',
'./build/public/styles/{,*/}*.css',
'./build/public/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}',
'./build/public/styles/fonts/*',
'./build/public/styles/main.css',
'./build/public/extensions/*.js',
'./build/public/translations/*.json'
],
runtimeCaching: [
{
urlPattern: /\.cdn\.com/,
handler: 'cacheFirst',
options: {
cacheName: 'image-cache',
cacheExpiration: {
maxEntries: 50,
},
},
},
{
urlPattern: /api/,
handler: 'cacheFirst',
options: {
cacheName: 'config-cache',
cacheExpiration: {
maxEntries: 10,
},
},
}
]
})
})
ServiceWorker.js 정확하게 작동하지 않았다 무엇
importScripts('workbox-sw.prod.v2.0.0.js');
const workboxSW = new WorkboxSW();
workboxSW.precache([]);
workboxSW.router.registerRoute('https://fonts.googleapis.com/(.*)',
workboxSW.strategies.cacheFirst({
cacheName: 'googleapis',
cacheExpiration: {
maxEntries: 20
},
cacheableResponse: {statuses: [0, 200]}
})
);
workboxSW.router.registerRoute('http://weloveiconfonts.com/(.*)',
workboxSW.strategies.cacheFirst({
cacheName: 'iconfonts',
cacheExpiration: {
maxEntries: 20
},
cacheableResponse: {statuses: [0, 200]}
})
);
// We want no more than 50 images in the cache. We check using a cache first strategy
workboxSW.router.registerRoute(/\.(?:png|gif|jpg)$/,
workboxSW.strategies.cacheFirst({
cacheName: 'images-cache',
cacheExpiration: {
maxEntries: 50
}
})
);