From 2da8ba84c95ea798ca6b9fec9b57c5d498dc3cac Mon Sep 17 00:00:00 2001 From: rohitpal Date: Sun, 12 Mar 2017 05:25:01 +0530 Subject: [PATCH 1/6] offline-plugin-integration initial commit --- examples/offline-nuxt/nuxt.config.js | 4 ++ examples/offline-nuxt/package.json | 8 ++++ examples/offline-nuxt/pages/index.vue | 5 +++ examples/offline-nuxt/plugins/init-offline.js | 3 ++ lib/webpack/client.config.js | 40 +++++++++++++++++++ package.json | 1 + 6 files changed, 61 insertions(+) create mode 100644 examples/offline-nuxt/nuxt.config.js create mode 100644 examples/offline-nuxt/package.json create mode 100644 examples/offline-nuxt/pages/index.vue create mode 100644 examples/offline-nuxt/plugins/init-offline.js diff --git a/examples/offline-nuxt/nuxt.config.js b/examples/offline-nuxt/nuxt.config.js new file mode 100644 index 0000000000..38d7a4050a --- /dev/null +++ b/examples/offline-nuxt/nuxt.config.js @@ -0,0 +1,4 @@ +module.exports = { + offline: true, // true or https://github.com/NekR/offline-plugin/blob/master/docs/options.md + plugins: ['~plugins/init-offline.js'] +} diff --git a/examples/offline-nuxt/package.json b/examples/offline-nuxt/package.json new file mode 100644 index 0000000000..20c76d1b6b --- /dev/null +++ b/examples/offline-nuxt/package.json @@ -0,0 +1,8 @@ +{ + "name": "offline-config-nuxt", + "scripts": { + "dev": "../../bin/nuxt", + "build": "../../bin/nuxt build", + "start": "../../bin/nuxt start" + } +} diff --git a/examples/offline-nuxt/pages/index.vue b/examples/offline-nuxt/pages/index.vue new file mode 100644 index 0000000000..bb1b2bacae --- /dev/null +++ b/examples/offline-nuxt/pages/index.vue @@ -0,0 +1,5 @@ + diff --git a/examples/offline-nuxt/plugins/init-offline.js b/examples/offline-nuxt/plugins/init-offline.js new file mode 100644 index 0000000000..a2b6086a0f --- /dev/null +++ b/examples/offline-nuxt/plugins/init-offline.js @@ -0,0 +1,3 @@ +if (process.BROWSER_BUILD && process.env.NODE_ENV === 'production') { + require('offline-plugin/runtime').install() +} diff --git a/lib/webpack/client.config.js b/lib/webpack/client.config.js index 8cee34438e..46f1a14a45 100644 --- a/lib/webpack/client.config.js +++ b/lib/webpack/client.config.js @@ -7,6 +7,36 @@ import ProgressBarPlugin from 'progress-bar-webpack-plugin' import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer' import base from './base.config.js' import { resolve } from 'path' + +// offline plugin copy generated assets to static directory +function OfflinePluginCopyAssetsPlugin(assets, toDir) { + this.assets = assets + this.toDir = toDir +} +OfflinePluginCopyAssetsPlugin.prototype.apply = function(compiler) { + compiler.plugin('after-emit', function(compilation, callback) { + const assets = this.assets.length > 0 ? this.assets : [] + + if (!fs.existsSync(this.toDir)){ + fs.mkdirSync(this.toDir) + fs.mkdirSync(`${this.toDir}/appcache`) + } + + let renamePromises = [] + assets.forEach((asset) => { + renamePromises.push(rename(`.nuxt/dist/${asset}`, `${this.toDir}/${asset}`)) + }) + + Promise.all(renamePromises) + .then(() => { + console.log('\noffline content to static directory...') + }) + .catch((error) => { + console.error('\noffline-plugin copy error', error) + }); + }.bind(this)); +} + /* |-------------------------------------------------------------------------- | Webpack Client Config @@ -85,6 +115,16 @@ export default function () { isClient: true }) } + // Offline-plugin integration + if (!this.dev && this.options.offline) { + const offlineOpts = typeof this.options.offline === 'object' ? this.options.offline : {} + config.plugins.push( + new OfflinePlugin(offlineOpts), + new OfflinePluginCopyAssetsPlugin( + ['sw.js', 'appcache/manifest.appcache', 'appcache/manifest.html' + ], 'static') + ) + } // Webpack Bundle Analyzer if (!this.dev && this.options.build.analyze) { let options = {} diff --git a/package.json b/package.json index 7d860957c6..298a226a87 100644 --- a/package.json +++ b/package.json @@ -107,6 +107,7 @@ "jsdom": "^9.10.0", "json-loader": "^0.5.4", "nyc": "^10.1.2", + "offline-plugin": "^4.6.1", "request": "^2.79.0", "request-promise-native": "^1.0.3", "webpack-node-externals": "^1.5.4" From 7eccd429ca0d65b473962747d8f24721a0006ca6 Mon Sep 17 00:00:00 2001 From: rohitpal Date: Sun, 12 Mar 2017 05:32:28 +0530 Subject: [PATCH 2/6] fixed import --- lib/webpack/client.config.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/lib/webpack/client.config.js b/lib/webpack/client.config.js index 46f1a14a45..d9c27e0a36 100644 --- a/lib/webpack/client.config.js +++ b/lib/webpack/client.config.js @@ -5,8 +5,12 @@ import webpack from 'webpack' import ExtractTextPlugin from 'extract-text-webpack-plugin' import ProgressBarPlugin from 'progress-bar-webpack-plugin' import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer' +import OfflinePlugin from 'offline-plugin' import base from './base.config.js' import { resolve } from 'path' +import fs from 'fs-extra' +import pify from 'pify' +const rename = pify(fs.rename) // offline plugin copy generated assets to static directory function OfflinePluginCopyAssetsPlugin(assets, toDir) { From f584a221ee86856f1c5cb61bdd12e48d0858a4cf Mon Sep 17 00:00:00 2001 From: rohitpal Date: Sun, 12 Mar 2017 05:43:34 +0530 Subject: [PATCH 3/6] service worker registraion --- examples/offline-nuxt/plugins/init-offline.js | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/examples/offline-nuxt/plugins/init-offline.js b/examples/offline-nuxt/plugins/init-offline.js index a2b6086a0f..1dfa5336fa 100644 --- a/examples/offline-nuxt/plugins/init-offline.js +++ b/examples/offline-nuxt/plugins/init-offline.js @@ -1,3 +1,20 @@ if (process.BROWSER_BUILD && process.env.NODE_ENV === 'production') { require('offline-plugin/runtime').install() + window.onNuxtReady((app) => { + if ('serviceWorker' in navigator) { + if (navigator.serviceWorker.controller) {} else { + navigator.serviceWorker.register('/_nuxt/tcmpsw.js', {scope: '/'}).then(function(res) { + console.log('sw loaded...') + }).catch(function(err) { + console.log(err); + }); + } + } else if (window.applicationCache) { + // register appcache code + var iframe = document.createElement('iframe'); + iframe.style.display = "none"; + iframe.src = '/_nuxt/appcache/manifest.html'; + document.body.appendChild(iframe); + } + }) } From b12ea53a94d2cb1c92080d0a0e6b0a75d864c6b2 Mon Sep 17 00:00:00 2001 From: rohitpal Date: Sun, 12 Mar 2017 20:46:16 +0530 Subject: [PATCH 4/6] fixed sw/appcache paths --- examples/offline-nuxt/plugins/init-offline.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/examples/offline-nuxt/plugins/init-offline.js b/examples/offline-nuxt/plugins/init-offline.js index 1dfa5336fa..e1cb518e93 100644 --- a/examples/offline-nuxt/plugins/init-offline.js +++ b/examples/offline-nuxt/plugins/init-offline.js @@ -3,7 +3,7 @@ if (process.BROWSER_BUILD && process.env.NODE_ENV === 'production') { window.onNuxtReady((app) => { if ('serviceWorker' in navigator) { if (navigator.serviceWorker.controller) {} else { - navigator.serviceWorker.register('/_nuxt/tcmpsw.js', {scope: '/'}).then(function(res) { + navigator.serviceWorker.register('/sw.js').then(function(res) { console.log('sw loaded...') }).catch(function(err) { console.log(err); @@ -13,7 +13,7 @@ if (process.BROWSER_BUILD && process.env.NODE_ENV === 'production') { // register appcache code var iframe = document.createElement('iframe'); iframe.style.display = "none"; - iframe.src = '/_nuxt/appcache/manifest.html'; + iframe.src = '/appcache/manifest.html'; document.body.appendChild(iframe); } }) From ddbb4b96d1330c961c50f58c97bd8c8ba21b6752 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= Date: Sat, 8 Apr 2017 11:30:06 +0200 Subject: [PATCH 5/6] Set ssr: false --- examples/offline-nuxt/nuxt.config.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/examples/offline-nuxt/nuxt.config.js b/examples/offline-nuxt/nuxt.config.js index 38d7a4050a..168ad0499c 100644 --- a/examples/offline-nuxt/nuxt.config.js +++ b/examples/offline-nuxt/nuxt.config.js @@ -1,4 +1,6 @@ module.exports = { offline: true, // true or https://github.com/NekR/offline-plugin/blob/master/docs/options.md - plugins: ['~plugins/init-offline.js'] + plugins: [ + { src: '~plugins/init-offline.js', ssr: false } + ] } From 757eaf7908a53c4d658e7ed74c4b4992b83911e5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Chopin?= Date: Sat, 8 Apr 2017 11:34:42 +0200 Subject: [PATCH 6/6] Update init-offline.js --- examples/offline-nuxt/plugins/init-offline.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/offline-nuxt/plugins/init-offline.js b/examples/offline-nuxt/plugins/init-offline.js index e1cb518e93..a0fd8f5edb 100644 --- a/examples/offline-nuxt/plugins/init-offline.js +++ b/examples/offline-nuxt/plugins/init-offline.js @@ -1,4 +1,4 @@ -if (process.BROWSER_BUILD && process.env.NODE_ENV === 'production') { +if (process.env.NODE_ENV === 'production') { require('offline-plugin/runtime').install() window.onNuxtReady((app) => { if ('serviceWorker' in navigator) {