node package manager

mango-cli

mango-cli CircleCI Build Status Build status NPM downloads

mangoweb.github.io/mango

Scaffold and build your projects way more faster than before. Preconfigured frontend devstack to the absolute perfection. Fully automated to save your precious time. Ready for any type of web project.

A little example project is here: manGoweb/mango-cli-example.

If you already have mango-cli you can init the example project simply by mango init [your-directory]

Under the hood

Styles
Stylusexpressive, robust, feature-rich CSS preprocessor
SassCSS with superpowers
Lessthe dynamic stylesheet language
Autoprefixer vendor prefixes based on the real usage
Clean-CSSFast and efficient CSS minifier
Templates
Jaderobust, elegant and feature rich template engine
Scripts
BabelUse next generation JavaScript today
ReactJavaScript library for building user interfaces from Facebook
CoffeeScriptlittle language that compiles into JavaScript
WebmakeJavaScript bundling with require() in the browser
UglifyJSJavaScript minifier
Tools
BrowserSyncTime-saving synchronised browser testing
NPMNode.js package manager
GulpAutomated build tasks
ImageminSeamless image minification
Sourcemapsdebug like a pro

Installation

Install mango-cli once from npm and use it everywhere:

npm install -g mango-cli

Just a few requirements you already have: latest Node.js and Git executable in PATH.

If you are running Windows, there are even some more special requirements because of node-gyp.
On OS X you can come across a problem with missing vips library. Install it with brew install homebrew/science/vips --with-webp --with-graphicsmagick first and then continue.

If you're having problems with the installation, check out prepared release packages. Extract them locally and run npm link in the mango-cli folder.

Usage

  • mango init - scaffolding and initialization
  • mango install - dependency installation
  • mango build - production build
  • mango dev - development mode

Feel free to use mango [command] -h for detailed instructions

Project scaffolding and initialization

mango init [options] [directory]

Forks a template into folder.

Options:

  • -s, --source [git_repository] - git repository with a template to fork. Default is currently the Frontbase

Managing project dependencies

mango install [packages...]

Installs packages from NPM and stores them in node_modules folder, from where you can require them (thanks to browserify). Maintain current list in the mango.yaml config file under the dependencies section.

Project build

Assuming the config file mango.yaml is present in a current directory and contains:

styles:
  - styles/screen.styl
scripts:
  - scripts/index.js
images:
  - images/**/*.{jpg,png,svg}
templates:
  - templates/**/*.jade
static:
  - fonts/**
dependencies:
  - jquery
watch:
  - app/**
dist_folder: dist

Config file can be also in mango.json file and parsed as a JSON file.

Production build

mango build [tasks...]

All assets are compiled and minified into dist_folder, ready for production use. In case of server compilation try a stripped down mango-cli-core package instead.

Options:

  • [tasks...] - run only specified tasks as styles, scripts, images, templates, static

Development mode

mango dev [http_proxy]

Starts BrowserSync server (or proxy server) and watch for assets change.

Configuration

More in Configuration options docs...

Copyright

Copyright 2016-2017 manGoweb s.r.o. Code released under the MIT license. Evolved from Frontbase devstack.