diff --git a/examples/web-worker/.eslintrc.js b/examples/web-worker/.eslintrc.js
new file mode 100644
index 0000000000..32617b7df2
--- /dev/null
+++ b/examples/web-worker/.eslintrc.js
@@ -0,0 +1,21 @@
+module.exports = {
+ root: true,
+ env: {
+ browser: true,
+ node: true
+ },
+ parserOptions: {
+ parser: 'babel-eslint'
+ },
+ extends: [
+ // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
+ // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
+ 'plugin:vue/strongly-recommended'
+ ],
+ // required to lint *.vue files
+ plugins: [
+ 'vue'
+ ],
+ // add your custom rules here
+ rules: {}
+}
diff --git a/examples/web-worker/.gitignore b/examples/web-worker/.gitignore
new file mode 100644
index 0000000000..7ee6115053
--- /dev/null
+++ b/examples/web-worker/.gitignore
@@ -0,0 +1,11 @@
+# dependencies
+node_modules
+
+# logs
+npm-debug.log
+
+# Nuxt build
+.nuxt
+
+# Nuxt generate
+dist
diff --git a/examples/web-worker/README.md b/examples/web-worker/README.md
new file mode 100644
index 0000000000..aa88a7c0db
--- /dev/null
+++ b/examples/web-worker/README.md
@@ -0,0 +1,26 @@
+# web-worker
+
+> Nuxt.js project
+
+In nuxt 1.4 and below you have to create a production build to use web workers.
+
+## Build Setup
+
+``` bash
+# install dependencies
+$ npm install # Or yarn install
+
+# serve with hot reload at localhost:3000
+# nuxt 1.4 and below does not support web workers in dev mode
+$ npm run dev
+
+# build for production and launch server
+# in nuxt 1.4 and below you have to create a production build to use web workers
+$ npm run build
+$ npm start
+
+# generate static project
+$ npm run generate
+```
+
+For detailed explanation on how things work, checkout the [Nuxt.js docs](https://github.com/nuxt/nuxt.js).
diff --git a/examples/web-worker/assets/README.md b/examples/web-worker/assets/README.md
new file mode 100644
index 0000000000..c67cf2e260
--- /dev/null
+++ b/examples/web-worker/assets/README.md
@@ -0,0 +1,8 @@
+# ASSETS
+
+This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/assets#webpacked
+
+**This directory is not required, you can delete it if you don't want to use it.**
diff --git a/examples/web-worker/assets/js/Example.worker.js b/examples/web-worker/assets/js/Example.worker.js
new file mode 100644
index 0000000000..eb74bfad6a
--- /dev/null
+++ b/examples/web-worker/assets/js/Example.worker.js
@@ -0,0 +1,17 @@
+// // block for `time` ms, then return the number of loops we could run in that time:
+function expensive(time) {
+ let start = Date.now(),
+ count = 0
+ while (Date.now() - start < time) count++
+ return count
+}
+
+// Respond to message from parent thread
+self.addEventListener('message', (event) => {
+ console.log('worker', event.data)
+
+ if (event.data.action === 'expensive' && event.data.time) {
+ // Post data to parent thread
+ self.postMessage(expensive(Number(event.data.time)))
+ }
+})
diff --git a/examples/web-worker/components/AppLogo.vue b/examples/web-worker/components/AppLogo.vue
new file mode 100644
index 0000000000..8885e9498a
--- /dev/null
+++ b/examples/web-worker/components/AppLogo.vue
@@ -0,0 +1,79 @@
+
+
+
+
+
diff --git a/examples/web-worker/components/README.md b/examples/web-worker/components/README.md
new file mode 100644
index 0000000000..d7768ddb5f
--- /dev/null
+++ b/examples/web-worker/components/README.md
@@ -0,0 +1,6 @@
+# COMPONENTS
+
+The components directory contains your Vue.js Components.
+Nuxt.js doesn't supercharge these components.
+
+**This directory is not required, you can delete it if you don't want to use it.**
diff --git a/examples/web-worker/layouts/README.md b/examples/web-worker/layouts/README.md
new file mode 100644
index 0000000000..83d09caee8
--- /dev/null
+++ b/examples/web-worker/layouts/README.md
@@ -0,0 +1,8 @@
+# LAYOUTS
+
+This directory contains your Application Layouts.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/views#layouts
+
+**This directory is not required, you can delete it if you don't want to use it.**
diff --git a/examples/web-worker/layouts/default.vue b/examples/web-worker/layouts/default.vue
new file mode 100644
index 0000000000..6d8b86b457
--- /dev/null
+++ b/examples/web-worker/layouts/default.vue
@@ -0,0 +1,58 @@
+
+
+
+
+
+
+
diff --git a/examples/web-worker/nuxt.config.js b/examples/web-worker/nuxt.config.js
new file mode 100644
index 0000000000..a05beaa98f
--- /dev/null
+++ b/examples/web-worker/nuxt.config.js
@@ -0,0 +1,49 @@
+module.exports = {
+ /*
+ ** Headers of the page
+ */
+ head: {
+ title: 'web-worker',
+ meta: [
+ { charset: 'utf-8' },
+ { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+ { hid: 'description', name: 'description', content: 'Nuxt.js project' }
+ ],
+ link: [
+ { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
+ ]
+ },
+ /*
+ ** Customize the progress bar color
+ */
+ loading: { color: '#3B8070' },
+ plugins: [
+ { src: '~/plugins/inject-ww', ssr: false } // web workers are only available client-side, hence ssr: false
+ ],
+ /*
+ ** Build configuration
+ */
+ build: {
+ /*
+ ** Run ESLint on save
+ */
+ extend (config, { isDev, isClient }) {
+ if (isDev && isClient) {
+ config.module.rules.push({
+ enforce: 'pre',
+ test: /\.(js|vue)$/,
+ loader: 'eslint-loader',
+ exclude: /(node_modules)/
+ })
+ }
+
+ if (isClient) { // web workers are only available client-side
+ config.module.rules.push({
+ test: /\.worker\.js$/, // this will pick up all .js files that ends with ".worker.js"
+ loader: 'worker-loader',
+ exclude: /(node_modules)/
+ })
+ }
+ }
+ }
+}
diff --git a/examples/web-worker/package.json b/examples/web-worker/package.json
new file mode 100644
index 0000000000..97043593ea
--- /dev/null
+++ b/examples/web-worker/package.json
@@ -0,0 +1,19 @@
+{
+ "name": "web-worker",
+ "description": "Demo web workers in nuxt.js",
+ "private": true,
+ "scripts": {
+ "dev": "nuxt",
+ "build": "nuxt build",
+ "start": "nuxt start",
+ "generate": "nuxt generate",
+ "lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
+ "precommit": "npm run lint"
+ },
+ "dependencies": {
+ "nuxt": "^1.4.0"
+ },
+ "devDependencies": {
+ "worker-loader": "^1.1.1"
+ }
+}
diff --git a/examples/web-worker/pages/README.md b/examples/web-worker/pages/README.md
new file mode 100644
index 0000000000..b007071639
--- /dev/null
+++ b/examples/web-worker/pages/README.md
@@ -0,0 +1,7 @@
+# PAGES
+
+This directory contains your Application Views and Routes.
+The framework reads all the .vue files inside this directory and creates the router of your application.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/routing
diff --git a/examples/web-worker/pages/index.vue b/examples/web-worker/pages/index.vue
new file mode 100644
index 0000000000..bd1e3a37a6
--- /dev/null
+++ b/examples/web-worker/pages/index.vue
@@ -0,0 +1,160 @@
+
+
+
+
+
+ web-worker
+
+
+ Nuxt.js project
+
+
{{ notification }}
+
+ - Number of Web Workers: {{ workers.length }}
+ - Number of long Running Workers: {{ longRunningWorkers.length }}
+ - Number of unused Workers: {{ workers.filter(w => !w.inUse).length }}
+
+
+
+
+
+
+
+
+
diff --git a/examples/web-worker/plugins/README.md b/examples/web-worker/plugins/README.md
new file mode 100644
index 0000000000..ec39a25e3f
--- /dev/null
+++ b/examples/web-worker/plugins/README.md
@@ -0,0 +1,8 @@
+# PLUGINS
+
+This directory contains your Javascript plugins that you want to run before instantiating the root vue.js application.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/plugins
+
+**This directory is not required, you can delete it if you don't want to use it.**
diff --git a/examples/web-worker/plugins/inject-ww.js b/examples/web-worker/plugins/inject-ww.js
new file mode 100644
index 0000000000..f1935cdf5d
--- /dev/null
+++ b/examples/web-worker/plugins/inject-ww.js
@@ -0,0 +1,9 @@
+import ExampleWorker from '~/assets/js/Example.worker.js' // worker files has to end in ".worker.js" - see nuxt.config.js
+
+export default (context, inject) => {
+ inject('worker', {
+ createWorker () {
+ return new ExampleWorker()
+ }
+ })
+}
diff --git a/examples/web-worker/static/README.md b/examples/web-worker/static/README.md
new file mode 100644
index 0000000000..66fe23aac1
--- /dev/null
+++ b/examples/web-worker/static/README.md
@@ -0,0 +1,11 @@
+# STATIC
+
+This directory contains your static files.
+Each file inside this directory is mapped to /.
+
+Example: /static/robots.txt is mapped as /robots.txt.
+
+More information about the usage of this directory in the documentation:
+https://nuxtjs.org/guide/assets#static
+
+**This directory is not required, you can delete it if you don't want to use it.**
diff --git a/examples/web-worker/static/favicon.ico b/examples/web-worker/static/favicon.ico
new file mode 100644
index 0000000000..382fecbbf9
Binary files /dev/null and b/examples/web-worker/static/favicon.ico differ
diff --git a/package.json b/package.json
index d4210c221e..83641197e0 100644
--- a/package.json
+++ b/package.json
@@ -130,6 +130,7 @@
"eslint-plugin-promise": "^3.7.0",
"eslint-plugin-react": "^7.6.1",
"eslint-plugin-standard": "^3.0.1",
+ "eslint-plugin-vue": "^4.3.0",
"express": "^4.16.2",
"finalhandler": "^1.1.1",
"get-port": "^3.2.0",