Skip to content

RipripKipkip/emotion

Repository files navigation

Landing eMotion with Html (Flexbox), SASS and JS

System Preparation

To use this starter project, you'll need the following things installed on your machine.

  1. NodeJS - use the installer.
  2. GulpJS - $ npm install -g gulp (mac users may need sudo)
$ browser-sync start --server --files '.'

and in the other terminal :

$ gulp sass

Local Installation

  1. Clone this repo, or download it into a directory of your choice.
  2. Inside the directory, run npm install.

Usage

development mode

This will give you file watching, browser synchronisation, auto-rebuild, CSS injecting etc etc. docs

$ gulp

Deploy with Gulpfile

var gulp = require('gulp');
var sass = require('gulp-sass');
var browserSync = require('browser-sync');

// gulp.task('sass', function () {
//     gulp.src('scss/styles.sass')
//         .pipe(sass({includePaths: ['scss']}))
//         .pipe(gulp.dest('css'));
// });

gulp.task('sass', function (done) {
	gulp.src('scss/styles.sass')
		.pipe(sass())
		.on('error', sass.logError)
		.pipe(gulp.dest('css/'))
		.on('end', done);
});

// Tâche "watch" = je surveille *less
gulp.task('watch', ['sass', 'browser-sync'], function () {
  gulp.watch('/css/*.css', ['sass']);
});

gulp.task('browser-sync', function() {
    browserSync.init(["css/*.css", "js/*.js"], {
        server: {
            baseDir: "./"
        }
    });
});

GIT

$ git add *
$ git commit -m 'message'
$ git push -u origin master

Git