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
*.lcov
.nyc_output
.vscode

View File

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

View File

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

View File

@ -1,5 +1,3 @@
<template>
<div>
This is offline test
</div>
<div>This is offline test</div>
</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/,
query: defaults(this.options.build.babel, {
presets: ['vue-app'],
babelrc: false,
cacheDirectory: !!this.dev
})
},

View File

@ -1,6 +1,6 @@
'use strict'
import { each } from 'lodash'
import { each, defaults } from 'lodash'
import webpack from 'webpack'
import HTMLPlugin from 'html-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 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) {
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) {
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'
)
new OfflinePlugin(defaults(offlineOpts, {}))
)
}
// Webpack Bundle Analyzer

View File

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