Build tools

To customize Mobi.css, you need to be familiar with some tools.

npm

npm is the node package manager.

We use npm to install, run scripts, manage versions.

Once cloned Mobi.css main repository or plugin/theme repos, the package.json descripts some avalible scripts.

The basic scripts are npm install, npm start and npm test:

npm install     # Install the dependencies
npm start       # Build css, js and docs. Serve public. Watch changes
npm test        # Run lint and tests

Other useful scripts:

npm run build   # Build css, js and docs
npm run lint    # Lint styles and scripts
npm version patch/minor/major
                # Update the version. This will run preversion and version scripts
npm publish     # Publish the current version

gulp

gulp is a task runner for development.

Actually npm start and npm build are simply run gulp tasks.

Sass

Sass is a css preprocessor.

We use SCSS syntax to write css.

PostCSS

PostCSS is a tool for transforming styles with JS plugins.

We use Autoprefixer plugin to ensure Mobi.css works on all major mobile devices.

stylelint

Stylelint is a mighty, modern CSS linter.

ESLint

ESLint is a JavaScript linter.

Pagic

Pagic is a static site generator, most of Mobi.css docs are generated by it.