UPDATE: the generator has been included into @pnp/spfx generator. Please use this one for the latest version.

This is the third post about SharePoint Framework and Vue.js. In this post I want to announce a Yeoman generator for SPFx web part with Vue.js support.

List of posts:

  1. Whats and Whys
  2. Default SPFx web part using Vue.js
  3. Yeoman generator with Vue support (this post)
  4. Web Part Property Pane Control
  5. Use React Components inside Vue.js Solution
So, in the previous post we went through all the needed configurations to add Vue.js support to SharePoint Framework project and to implement simple web part using Vue Single File Component.
And not it feels natural that it would be great to have automatic way of creating SPFx projects with Vue.js support.
That's why I've created a Yeoman generator that does all the stuff automatically.
The generator in called vuespfx and available as NPM package.
To use it just install the package to your machine:

npm i -g generator-vuespfx
And then use it in the same way as @microsoft/generator-sharepoint: 
yo vuespfx
This will
  • create SPFx solution with a client-side web part,
  • add all needed dependencies for Vue.js,
  • create Vue.js Single File Component (SFC) with default web part markup
  • add SFC component to the web part's code
Currently the generator supports web parts only. But I'll update it to add Extensions support as well.
If you want to contribute, feel free. Go to https://github.com/AJIXuMuK/generator-vuespfx fork it and create pull requests.
Please, leave your feedback regarding the generator!

That's it!
Have fun and stay tuned!