-
Notifications
You must be signed in to change notification settings - Fork 44
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(pwa): initial ServiceWorker and Web App Manifest support
This package adds ServiceWorker and Web App Manifest capabilities to
your Hops application.
To use it:
- add `hops-pwa` as a dependency to your project
- create a Web App Manifest and load it in your app:
```jsx
<Helmet>
<link rel="manifest" href={require('./manifest.webmanifest')} />
</Helmet>
```
- specify the path to the Service Worker file in your Hops config:
```json
"hops": {
"workerFile": "hops-pwa/worker.js"
}
```
You can either use the default worker provided by the `hops-pwa`
package or you can specify a path to your own worker implementation.- Loading branch information
1 parent
ec7f016
commit 6fe9ddb
Showing
14 changed files
with
233 additions
and
4 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,56 @@ | ||
| 'use strict'; | ||
|
|
||
| var SingleEntryPlugin = require('webpack/lib/SingleEntryPlugin'); | ||
| var RawSource = require('webpack-sources').RawSource; | ||
|
|
||
| var hopsConfig = require('hops-config'); | ||
|
|
||
| var PLUGIN_NAME = 'hops-service-worker-plugin'; | ||
|
|
||
| module.exports = function ServiceWorkerPlugin() { | ||
| var assetPath = hopsConfig.workerPath.replace(/^\/+/, ''); | ||
|
|
||
| this.apply = function(compiler) { | ||
| if (!hopsConfig.workerFile) { | ||
| return; | ||
| } | ||
|
|
||
| function onMake(compilation, callback) { | ||
| compilation | ||
| .createChildCompiler(PLUGIN_NAME, { filename: assetPath }, [ | ||
| new SingleEntryPlugin( | ||
| compiler.context, | ||
| require.resolve('../shims/worker-shim'), | ||
| 'worker' | ||
| ), | ||
| ]) | ||
| .runAsChild(callback); | ||
| } | ||
|
|
||
| function onEmit(compilation, callback) { | ||
| compilation.assets[assetPath] = new RawSource( | ||
| 'HOPS_ASSETS = ' + | ||
| JSON.stringify( | ||
| Object.keys(compilation.assets).filter(function(item) { | ||
| return !item.match(/\.map|stats\.json$/) && item !== assetPath; | ||
| }) | ||
| ) + | ||
| ';\n' + | ||
| compilation.assets[assetPath].source() | ||
| ); | ||
| callback(); | ||
| } | ||
|
|
||
| if (typeof compiler.hooks !== 'undefined') { | ||
| compiler.hooks.make.tapAsync(PLUGIN_NAME, onMake); | ||
| } else { | ||
| compiler.plugin('make', onMake); | ||
| } | ||
|
|
||
| if (typeof compiler.hooks !== 'undefined') { | ||
| compiler.hooks.emit.tap(PLUGIN_NAME, onEmit); | ||
| } else { | ||
| compiler.plugin('emit', onEmit); | ||
| } | ||
| }; | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
36 changes: 36 additions & 0 deletions
36
packages/build-config/sections/module-rules/webmanifest.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,36 @@ | ||
| 'use strict'; | ||
|
|
||
| var path = require('path'); | ||
|
|
||
| var hopsConfig = require('hops-config'); | ||
|
|
||
| exports.default = { | ||
| test: /\.webmanifest$/, | ||
| use: [ | ||
| { | ||
| loader: require.resolve('file-loader'), | ||
| options: { | ||
| name: path.join(hopsConfig.assetPath, '[name]-[hash:16].[ext]'), | ||
| }, | ||
| }, | ||
| { | ||
| loader: require.resolve('web-app-manifest-loader'), | ||
| }, | ||
| ], | ||
| }; | ||
|
|
||
| exports.node = { | ||
| test: /\.webmanifest$/, | ||
| use: [ | ||
| { | ||
| loader: require.resolve('file-loader'), | ||
| options: { | ||
| name: path.join(hopsConfig.assetPath, '[name]-[hash:16].[ext]'), | ||
| emitFile: false, | ||
| }, | ||
| }, | ||
| { | ||
| loader: require.resolve('web-app-manifest-loader'), | ||
| }, | ||
| ], | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| 'use strict'; | ||
|
|
||
| require('babel-polyfill'); | ||
|
|
||
| (function execute() { | ||
| var entryPoint = require('hops-worker-entry-point'); | ||
| if ( | ||
| typeof entryPoint !== 'function' && | ||
| typeof entryPoint.default === 'function' | ||
| ) { | ||
| entryPoint = entryPoint.default; | ||
| } | ||
| entryPoint(HOPS_ASSETS); // eslint-disable-line no-undef | ||
| if (module.hot) { | ||
| module.hot.accept(require.resolve('hops-worker-entry-point'), function() { | ||
| setTimeout(execute); | ||
| }); | ||
| } | ||
| })(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
| 'use strict'; | ||
|
|
||
| var hopsConfig = require('hops-config'); | ||
|
|
||
| module.exports = function installServiceWorker() { | ||
| return new Promise(function(resolve, reject) { | ||
| if (!('serviceWorker' in navigator)) { | ||
| return reject( | ||
| new Error('ServiceWorkers are not supported in this browser') | ||
| ); | ||
| } | ||
|
|
||
| if ( | ||
| window.location.protocol === 'https' || | ||
| window.location.hostname === 'localhost' | ||
| ) { | ||
| window.addEventListener('load', function() { | ||
| resolve(navigator.serviceWorker.register('/' + hopsConfig.workerPath)); | ||
| }); | ||
| } | ||
| }); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| 'use strict'; | ||
|
|
||
| module.exports = function installServiceWorke() { | ||
| return new Promise(function() { | ||
| /* intentionally left empty */ | ||
| }); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| { | ||
| "name": "hops-pwa", | ||
| "version": "10.1.0", | ||
| "description": "ServiceWorker and Web App Manifest support for Hops", | ||
| "keywords": ["hops", "serviceworker", "pwa", "web app manifest"], | ||
| "license": "MIT", | ||
| "main": "node.js", | ||
| "browser": "dom.js", | ||
| "files": ["dom.js", "node.js", "worker.js"], | ||
| "dependencies": { | ||
| "hops-config": "^10.0.1" | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| 'use strict'; | ||
|
|
||
| var hopsConfig = require('hops-config'); | ||
|
|
||
| module.exports = function(assets) { | ||
| console.log('hello from worker', assets, hopsConfig); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters