Installation¶
Note
The following dependencies should be installed on your system in order to work with this Boilerplate.
- Ruby: https://www.ruby-lang.org/
- Sass: http://sass-lang.com/
- Compass: http://compass-style.org/
- SCSS-Lint: https://github.com/brigade/scss-lint
- Bootstrap: https://github.com/twbs/bootstrap-sass
- Node JS: http://nodejs.org/
- Gulp: http://gulpjs.com/
You can find most installation steps within osx-bootstrap but in short:
- run
ruby -v
ensure ruby is installed - run
gem update --system
- run
gem install sass
- run
gem install compass
- run
gem install scss-lint
- run
gem install bootstrap-sass
- run
brew install node
when using Homebrew - run
curl -L https://npmjs.org/install.sh | sh
- run
npm install -g bower
- run
npm install -g gulp
At last make sure you correctly configured your paths.
Setup¶
Run the following commands to install all requirements from within the root of the package:
npm install
to install the requirements frompackage.json
bower install
to install the requirements frombower.json
via.bowerrc
Gulp Commands¶
Warning
Please mind that gulp
also starts browserSync equal to gulp browser
which tries to connect to a
Django server. The Django setup is not included within this boilerplate.
All front-end related tasks are handled via the Gulp task runner:
gulp
runs the gulp defaultsgulp watch
runs the gulp watch defaultsgulp lint
starts all linting services using.jshintrc
,.jscsrc
andscss-lint.json
gulp preprocess
optimises images within/static/img
and compiles YUIDoc intostatic/docs
gulp browser
connects to a given server (django) and runs live reload on a separate IPgulp tests
runs the test suite
We also offer some standalone commands:
gulp jslint
runs JavaScript lintinggulp scsslint
runs Sass lintinggulp images
optimises images within/static/img
gulp docs
compiles YUIDoc intostatic/docs
gulp karma
only runs karma for debugging
We love code over configuration.
Sass Compilation¶
You can compile/watch Sass using the following commands from within the root:
compass compile private
to compile the csscompass watch private
to constantly watch for changes and compile
The configuration will automatically be applied from /private/config.rb
.