Skip to content

Commit 81a0f79

Browse files
committed
add nuxt.js module
1 parent 957b39b commit 81a0f79

File tree

3 files changed

+64
-0
lines changed

3 files changed

+64
-0
lines changed

README.md

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,25 @@ Now `VueWait` will use `Vuex` store for data management which can be traced in `
8383

8484
<img src="./resources/vue-wait-2.gif" width="480">
8585

86+
## ♻️ Usage with Nuxt.js
87+
88+
Add `vue-wait/nuxt` to modules section of `nuxt.config.js`
89+
90+
```js
91+
{
92+
modules: [
93+
// Simple usage
94+
'vue-wait/nuxt'
95+
96+
// Optionally passing options in module configuration
97+
['vue-wait/nuxt', { useVuex: true }]
98+
],
99+
100+
// Optionally passing options in module top level configuration
101+
wait: { useVuex: true }
102+
}
103+
```
104+
86105
## 🔁 `VueWait` Options
87106

88107
You can use this options for customize VueWait behavior.

nuxt/index.js

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
/*
2+
Nuxt.js module for vue-wait
3+
4+
Usage:
5+
- Install vue-wait package
6+
- Add this into your nuxt.config.js file:
7+
{
8+
modules: [
9+
// Simple usage
10+
'vue-wait/nuxt'
11+
12+
// Optionally passing options in module configuration
13+
['vue-wait/nuxt', { useVuex: true }]
14+
],
15+
16+
// Optionally passing options in module top level configuration
17+
wait: { useVuex: true }
18+
}
19+
*/
20+
21+
const {resolve} = require('path');
22+
23+
module.exports = function nuxtVueWaitModule(moduleOptions) {
24+
const options = Object.assign({}, this.options.wait, moduleOptions);
25+
26+
// Register plugin
27+
this.addPlugin({
28+
src: resolve(__dirname, 'vue-wait-plugin.js'),
29+
fileName: 'vue-wait-plugin.template.js',
30+
options: options
31+
})
32+
};
33+
34+
// required by nuxt
35+
module.exports.meta = require('../package.json');

nuxt/vue-wait-plugin.template.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import Vue from 'vue';
2+
import VueWait from 'vue-wait';
3+
4+
Vue.use(VueWait); // add VueLoading as Vue plugin
5+
6+
export default ({app}) => {
7+
// inject options from module
8+
const pluginOptions = [<%= serialize(options) %>][0]
9+
app.wait = new VueWait(pluginOptions)
10+
}

0 commit comments

Comments
 (0)