Simplify offline plugin

This commit is contained in:
Sébastien Chopin 2017-04-17 15:27:32 +02:00
parent ec8291ea4c
commit e69aa7c401
9 changed files with 32 additions and 65 deletions

1
.gitignore vendored
View File

@ -18,3 +18,4 @@ examples/**/dist
coverage coverage
*.lcov *.lcov
.nyc_output .nyc_output
.vscode

View File

@ -1,6 +1,6 @@
module.exports = { module.exports = {
offline: true, // true or https://github.com/NekR/offline-plugin/blob/master/docs/options.md offline: true, // true or https://github.com/NekR/offline-plugin/blob/master/docs/options.md
plugins: [ plugins: [
{ src: '~plugins/init-offline.js', ssr: false } { src: '~plugins/offline.js', ssr: false }
] ]
} }

View File

@ -1,8 +1,11 @@
{ {
"name": "offline-config-nuxt", "name": "offline-config-nuxt",
"scripts": { "scripts": {
"dev": "../../bin/nuxt", "dev": "nuxt",
"build": "../../bin/nuxt build", "build": "nuxt build",
"start": "../../bin/nuxt start" "start": "nuxt start"
},
"dependencies": {
"nuxt": "latest"
} }
} }

View File

@ -1,5 +1,3 @@
<template> <template>
<div> <div>This is offline test</div>
This is offline test
</div>
</template> </template>

View File

@ -1,20 +0,0 @@
if (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('/sw.js').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 = '/appcache/manifest.html';
document.body.appendChild(iframe);
}
})
}

View File

@ -0,0 +1,19 @@
if (process.env.NODE_ENV === 'production') {
var OfflinePlugin = require('offline-plugin/runtime')
window.onNuxtReady(() => {
OfflinePlugin.install({
onInstalled: function () {
console.log('Offline plugin installed.') // eslint-disable-line no-console
},
onUpdating: function () {
},
onUpdateReady: function () {
OfflinePlugin.applyUpdate()
},
onUpdated: function () {
window.location.reload()
}
})
})
}

View File

@ -67,6 +67,7 @@ export default function ({ isClient, isServer }) {
exclude: /node_modules/, exclude: /node_modules/,
query: defaults(this.options.build.babel, { query: defaults(this.options.build.babel, {
presets: ['vue-app'], presets: ['vue-app'],
babelrc: false,
cacheDirectory: !!this.dev cacheDirectory: !!this.dev
}) })
}, },

View File

@ -1,6 +1,6 @@
'use strict' 'use strict'
import { each } from 'lodash' import { each, defaults } from 'lodash'
import webpack from 'webpack' import webpack from 'webpack'
import HTMLPlugin from 'html-webpack-plugin' import HTMLPlugin from 'html-webpack-plugin'
import FriendlyErrorsWebpackPlugin from 'friendly-errors-webpack-plugin' import FriendlyErrorsWebpackPlugin from 'friendly-errors-webpack-plugin'
@ -11,38 +11,6 @@ import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
import OfflinePlugin from 'offline-plugin' import OfflinePlugin from 'offline-plugin'
import base from './base.config.js' import base from './base.config.js'
import { resolve } from 'path' 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) {
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...') // eslint-disable-line no-console
})
.catch((error) => {
console.error('\nOffline-plugin copy error', error) // eslint-disable-line no-console
})
}.bind(this))
}
/* /*
|-------------------------------------------------------------------------- |--------------------------------------------------------------------------
@ -148,11 +116,7 @@ export default function () {
if (!this.dev && this.options.offline) { if (!this.dev && this.options.offline) {
const offlineOpts = typeof this.options.offline === 'object' ? this.options.offline : {} const offlineOpts = typeof this.options.offline === 'object' ? this.options.offline : {}
config.plugins.push( config.plugins.push(
new OfflinePlugin(offlineOpts), new OfflinePlugin(defaults(offlineOpts, {}))
new OfflinePluginCopyAssetsPlugin(
['sw.js', 'appcache/manifest.appcache', 'appcache/manifest.html'],
'static'
)
) )
} }
// Webpack Bundle Analyzer // Webpack Bundle Analyzer

View File

@ -5,6 +5,7 @@ import { defaults } from 'lodash'
export default function ({ isClient }) { export default function ({ isClient }) {
let babelOptions = JSON.stringify(defaults(this.options.build.babel, { let babelOptions = JSON.stringify(defaults(this.options.build.babel, {
presets: ['vue-app'], presets: ['vue-app'],
babelrc: false,
cacheDirectory: !!this.dev cacheDirectory: !!this.dev
})) }))
let config = { let config = {