mirror of
https://github.com/nuxt/nuxt.git
synced 2024-12-02 10:27:15 +00:00
Simplify offline plugin
This commit is contained in:
parent
ec8291ea4c
commit
e69aa7c401
1
.gitignore
vendored
1
.gitignore
vendored
@ -18,3 +18,4 @@ examples/**/dist
|
|||||||
coverage
|
coverage
|
||||||
*.lcov
|
*.lcov
|
||||||
.nyc_output
|
.nyc_output
|
||||||
|
.vscode
|
||||||
|
@ -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 }
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
@ -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"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,3 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>This is offline test</div>
|
||||||
This is offline test
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
@ -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);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
19
examples/offline-nuxt/plugins/offline.js
Normal file
19
examples/offline-nuxt/plugins/offline.js
Normal 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()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
@ -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
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
@ -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
|
||||||
|
@ -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 = {
|
||||||
|
Loading…
Reference in New Issue
Block a user