Yeoman Generator for Riot 3 with gulp, rollup and other good stuff
This is currently in beta stage, we are making it up as we going along. Anything broken whatever leave your comment here. Thanks!
npm install -g yo npm install -g generator-rtjs
Then generate your new project:
mkdir your-project-name && cd your-project name && yo rtjs your-project-name
Again we have English and Chinese support
yo rtjs your-new-project-name --lang=cn
Here are a few things you need to know (do) before you can use this generator for your next Riot (v.3) projects:
This is not official release yet. So you need to change a few of your own settings before you can use it.
If you have existing gulp (pre 4) installed globally. Then you need to uninstall it first:
$ npm remove gulp -g
Don't worry, you are going to install the new
gulp-cli. It works with older projects:
$ npm install gulp-cli -g
Please check out this article from liquidlight.co.uk for more detail.
We offer you 3+1 choices at the moment:
As you can see there are 2 both in alpha stage, use it with caution. We also offer you a new option to NOT include a CSS framework, you can DIY later on.
I never hide my dislike toward webpack and browsersify :p and I am using none of them. Rollup.js is at the heart of the build process. Go learn about it, and start loving it. UI DO NOT need to be complicated!
We are still using bower, yes. Why?
Important things should say 3 times:
Using npm to manage browser dependencies is a joke!
This is a tool for people whom are doing this line of work for living (paying rent anyone?) Not for those fools who ask questions like "X vs Y ...", "What is best ..."
I am not saying that's impossible, but programming world is huge, as huge as a galaxy, and different disciplines required different thinking. The more you try to use ONE WAY to deal with everything, you only ended up with dealing with NOTHING.
Let's take a look at an example when you use bower how do you deal with the vendor library injection (during DEV) if anyone has use my other generator's before, you should have seen the following.
bower install xyz --save
How do you do that using npm? Let say you are using webpack.
npm install xyz --save
import xyz from 'xyz';
OK they look similar, and easy enough, right?
How about distribution. Create a vendor separate files, oh how about your deploy environment is hip and edgy using HTTP2? With my other setup, it's simple as - do nothing and it will work, or use the bower.json file to grab the vendor and bundle it together and you get your vendor.js
You are fcuked if you are using npm and webpack - do that in the 90's style and read every package.json file and find out the path and write them manually in your index.html file. Or take a look at this question from stackoverflow. It makes me laugh.
I rest my case.
We are moving testing framework to Jest now. And since it's not really official supported by Jest. There might be some thing not working, we are discovering it's capability (In fact this generator is tested by Jest also) So learn along with us? Leave your comments, tips or any problems you encounter etc here in github. Appreciated.
There are three at the moment:
yo rtjs:mixin your-mixin-name
yo rtjs:tag your-tag-name
You can pass the
yo rtjs:tag your-tag-name --c=home
That will create your component inside your existing home tag folder. Type
yo rtjs:tag --help for USAGE (same for
Service sub generator has some different setup. It will check if you have certain package install (from bower). And ask you if you want to import them into your service class. @TODO it will also check your existing services folder and generate list for you to extend your new service from.
For more detail, check out the wiki page here (again, it was for the last version. We will update it as soon as possible)
MIT © joelchu