Vuetober is a vue-cli plugin for creating October themes with the latest frontend tooling. Say goodbye to managing complicated Webpack configuration and build scripts. Just select the features you want, and get to work!
There are two ways to get started with Vuetober. If you're new to vue-cli, we recommend using the pre-built SPA. Starting this way lets us make some decisions for you. Just perform a git clone, and you're theme is ready to go. This article provides a good overview of what vue-cli is, and why you should consider using it.
For more experienced users, use the following steps to create a custom Vuetober setup.
- Install vue-cli, see documentation here
- From
/themes, execute the following commands:vue create mythemeand select what features you'd likecd mythemevue add vuetoberand follow the prompts
Once this is done, the following commands should be available:
# start development server
yarn serve
# build production assets
yarn buildOther commands may also be available, depending on the feature selection. Check your package.json for a complete list.
When developing Vuetober themes, APIs are usually needed to communicate with plugins. Since all rendering is done on the client side, October's frontend utilities like components and the AJAX framework are not available. Below is a list of plugins that have been made to help bridge the gap.
We recommend adding the RainLab.Sitemap and Bedard.Prerender plugins. When used together, these can make sure your application is compatible with crawlers for sites like Google, Facebook, and Twitter.
For themes that include frontend unit tests, it's best to connect them to a service like Circle CI and Codecov to get the most out of them. In the future we will provide documentation on setting this up. For now, feel free to use this theme as an example.
Here are a couple sites to show what Vuetober themes are capable of. Feel free to add your projects to this list!
Copyright (c) 2016-present, Scott Bedard