# Showcase
Websites built with VuePress:
**Vue Ecosystem**
* [vue-cli](https://cli.vuejs.org/)
* [vuex](https://vuex.vuejs.org/)
* [vue-server-renderer](https://ssr.vuejs.org/)
**Community**
* [cr-vue](https://cr-vue.mio3io.com/)
* [vuesax](https://lusaxweb.github.io/vuesax/)
## Todo Features
VuePress is still a work in progress. There are a few things that it currently does not support but are planned:
- Plugin support
- Blogging support
Contributions are welcome!
## Development
> Please make sure your version of Node.js is greater than 8.
``` bash
yarn
yarn dev # serves VuePress' own docs with itself
yarn test # make sure your code change pass the test
```
## License
[MIT](https://github.com/vuejs/vuepress/blob/master/LICENSE)
@aleksejdix
@aleksejdix
Progressive STATIC SITE GENERATOR
@aleksejdix
Install
yarn global add vuepress
echo '# Hello Vue Meetup' > README.md
vuepress dev
@aleksejdix
add more pages
echo '# About' > about.md
echo '# Team' > team.md
@aleksejdix
CONFIG
create
.vuepress/config.js
@aleksejdix
nav: [
{ text: 'Home', link: '/' },
{ text: 'About', link: '/about' },
]NAVIGATION
@aleksejdix
sidebar: [
['/', 'Home']
['/about', 'About']
]SIDEBAR
@aleksejdix
I18n
locales: {
'/': { lang: 'en-US'},
'/it/': { lang: 'it-CH'},
'/de/': { lang: 'de-CH'},
'/fr/': { lang: 'fr-CH'}
},
@aleksejdix
SIDEBAR I18n
themeConfig: {
locales: {
'/': { sidebar: [ [ '/', 'Hallo' ] ] },
'/it/': { sidebar: [ [ '/it/', 'Ciao' ] ] },
'/de/': { sidebar: [ [ '/de/', 'Grüezi' ] ] },
'/fr/': { sidebar: [ [ '/fr/', 'Bonjour' ] ] }
}
}@aleksejdix
BUILt IN SEARCH
search: true, // default
searchMaxSuggestions: 10
@aleksejdix
OFFLINE with SW
serviceWorker: true
@aleksejdix
Powerful
Content Contol
@aleksejdix
MARKDOWN
[link](./home.md) => <router-link>
:green_heart: => 💚
[[toc]] => Page navigation@aleksejdix
MARKDOWN
::: tip
This is a tip
:::
::: warning
This is a warning
:::
::: danger
This is a dangerous warning
:::
@aleksejdix
VUE in markdown
{{ 1 + 8 }}
<div v-for="n in 10">{{n}}<div>@aleksejdix
VUE SFC in markdown
<custom-component>
<h1 slot="header">
Vuepress is cool
</h1>
</custom-component>@aleksejdix
custom Components
you can create components inside
.vuepress/components folder@aleksejdix
PersonAlized
Custom Themes
@aleksejdix
EJECT
vuepress eject <src>
@aleksejdix
OWN THEME
create .vuepress/theme/Layout.vue
and build your custom theme
themes are default Vue SPA's@aleksejdix
facts
codesplitting per page
seo friendly
works offline
works on any static serverTHANKS!