Adaptive.js Generator
A generator for Yeoman that lets you quickly setup an Adaptive.js project.
Usage
Install generator-adaptivejs
:
npm install -g generator-adaptivejs
Run yo adaptivejs
:
yo adaptivejs
Follow the prompts and answer the required questions
Once completed, run grunt preview
to start previewing
How to test a change to the generator
If you made a change to generator-adaptivejs
and you want to test the local
version of the Yeoman generator, run npm link
and then yo adaptivejs
.
Options
Slug
Specifying the --slug
option allows you to skip the prompt for entering the project's slug:
yo adaptivejs --slug [project-slug]
URL
Specifying the --url
option allows you to skip the prompt for entering your site's URL:
yo adaptivejs --url [site-url]
Defaults
If you want to use some simple defaults, you can use the --defaults
option:
yo adaptivejs --defaults
For Mobify's specific defaults, use the following:
yo adaptivejs --defaults mobify
Sub-generators
There are several sub-generators included:
View/Page
For generating additional pages with their respective files (view, template, UI script, integration test, and test fixture):
yo adaptivejs:view
or
yo adaptivejs:page
Git Hooks
For projects that already have linting tasks set up (grunt lint
, grunt scsslint
), easily add Mobify's pre-push git hook to lint your code while it is pushed up:
yo adaptivejs:githooks
The Living Styleguide
For projects that use the Mobify standard of libsass through grunt-sass
and node-sass-import-once
, add Mobify's Living Styleguide with:
yo adaptivejs:styleguide
Note: Several files may need overriding for these additions. Proceed with caution.
Linting
JavaScript source code in this generator is linted with ESLint according to our code syntax and style standards here at Mobify.
Linting may be run with:
grunt lint
Running tests
To run tests within generator-adaptivejs
itself (generator source code will be linted as well):
npm test
To run unit and integration tests in the generated project:
grunt test
To run nightwatch WebDriver tests in the generated project:
grunt nightwatch
To run nightwatch tests locally on a real device (android or ios, requires Appium):
grunt android (or grunt ios)
To run nightwatch tests on an Android emulator or iOS simulator on Sauce Labs:
grunt sauce-android (or grunt sauce-ios)
Building a custom selector library
The Adaptive generator allows you to install one of two selector libraries: jQuery or Zepto. We build custom versions of these selector libraries in order to add/remove specific features we require/don't require. Follow the directions below to build a custom version of your selector library of choice.
jQuery
By default, we remove a number of jQuery modules to reduce the overall file size. Please see the jQuery README in github for more information.
Clone and setup jQuery's dependencies
$ git clone https://github.com/jquery/jquery.git$ cd jquery$ npm install
Run the custom build
$ grunt custom:-deprecated,-ajax/jsonp,-deferred
Zepto
By default we build Zepto with the addition of the selector, stack, and data modules. Please see the Zepto README in github for more information.
Clone and setup Zepto's dependencies
$ git clone https://github.com/madrobby/zepto.git$ cd zepto$ npm install
Run the custom build
# build a custom zepto
$ MODULES="zepto event ajax form fx selector stack data" npm run-script dist
Once built, copy the zepto.js
and zepto.min.js
files into the app/vendor/zepto
directory in the root of your Adaptive project.
Documentation
Releasing
When releasing a new version, follow these steps:
- Bump version in package.json
- Add to CHANGELOG
- Create a new git tag corresponding to that version and push to origin.
npm publish