Skip to content
This repository was archived by the owner on Feb 24, 2023. It is now read-only.

Commit 3b4c248

Browse files
author
Łukasz Florczak
committed
SSR example (#19)
1 parent 5bd845b commit 3b4c248

File tree

1 file changed

+33
-0
lines changed

1 file changed

+33
-0
lines changed

README.md

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,39 @@ Every first-level child of `<agile>` is a new slide.
6868
</agile>
6969
```
7070

71+
## SSR Support
72+
73+
The component uses browser specific attributes (like `window` and `document`). It is necessary, so probably the only option is to run vue-agile only on the client-side. It was tested on [nuxt v1.0.0-rc7](https://github.com/nuxt/nuxt.js/releases/tag/v1.0.0-rc7) and works fine.
74+
75+
### Example
76+
```js
77+
// plugins/vue-agile.js
78+
79+
import Vue from 'vue'
80+
import VueAgile from 'vue-agile'
81+
82+
Vue.component('agile', VueAgile)
83+
```
84+
85+
```js
86+
// nuxt.config.js
87+
module.exports = {
88+
plugins: [
89+
{ src: '~/plugins/vue-agile', ssr: false }
90+
],
91+
}
92+
```
93+
94+
```vue
95+
<no-ssr placeholder="Loading...">
96+
<agile>
97+
...
98+
</agile>
99+
</no-ssr>
100+
```
101+
102+
PS. If you know a better way to work the component with SSR please, [let me know about it](https://github.com/lukaszflorczak/vue-agile/issues).
103+
71104
## Contributing
72105
```
73106
# install dependencies

0 commit comments

Comments
 (0)