Skip to content

Instantly share code, notes, and snippets.

@segebee

segebee/gulpfile.js

Forked from jadsalhani/gulpfile.js
Created August 11, 2016 03:41
Show Gist options
  • Save segebee/a03336633548683b7cf5286a7a563228 to your computer and use it in GitHub Desktop.
Save segebee/a03336633548683b7cf5286a7a563228 to your computer and use it in GitHub Desktop.
Download ZIP
Ionic Tutorial
Raw
gulpfile.js
var gulp = require('gulp');
var gutil = require('gulp-util');
var bower = require('bower');
var concat = require('gulp-concat');
var sass = require('gulp-sass');
var minifyCss = require('gulp-minify-css');
var rename = require('gulp-rename');
var sh = require('shelljs');
var uglify = require('gulp-uglify');
var mainBowerFiles = require('main-bower-files');
// **** Start Task Definition ****
gulp.task('copy', function(done) {
return gulp.src(['app/**/*.html', '!app/index.html'])
.pipe(gulp.dest('www/views/'));
});
gulp.task('copy_index', function(done) {
return gulp.src('app/index.html')
.pipe(gulp.dest('www/'));
});
gulp.task('ionic_sass', function(done) {
gulp.src('scss/ionic.app.scss')
.pipe(sass())
.on('error', sass.logError)
.pipe(gulp.dest('temp/css/'))
.on('end', done);
});
gulp.task('vendor_css', function(done) {
return gulp.src(mainBowerFiles('**/*.css'))
.pipe(concat('vendor.css'))
.pipe(gulp.dest('temp/css/'));
});
gulp.task('sass', function(done) {
gulp.src('app/**/*.scss')
.pipe(sass())
.pipe(concat('dist.css'))
.on('error', sass.logError)
.pipe(gulp.dest('temp/css/'))
.on('end', done);
});
gulp.task('compile_css', function(done) {
return gulp.src(['temp/css/vendor.css', 'temp/css/ionic.app.css', 'temp/css/dist.css'])
.pipe(concat('app.css'))
.pipe(minifyCss({
keepSpecialComments: 0
}))
.pipe(rename({
extname: '.min.css'
}))
.pipe(gulp.dest('www/css/'));
});
gulp.task('js', function(done) {
return gulp.src('app/**/*.js')
.pipe(concat('dist.js'))
.pipe(gulp.dest('temp/js/'));
});
gulp.task('vendor_js', function(done) {
return gulp.src(mainBowerFiles('**/*.js'))
.pipe(concat('vendor.js'))
.pipe(gulp.dest('temp/js/'));
});
gulp.task('compile_dist', function() {
return gulp.src(['temp/js/vendor.js', 'temp/js/dist.js'])
.pipe(concat('app.js'))
.pipe(uglify().on('error', gutil.log))
.pipe(gulp.dest('www/js/'));
})
gulp.task('watch', ['default'], function() {
gulp.watch('app/index.html', ['copy_index']);
gulp.watch('app/**/*.html', ['copy']);
gulp.watch('app/**/*.js', ['js']);
gulp.watch('app/**/*.scss', ['sass', 'compile_css']);
});
// **** End Task Definition ****
/*
Tasks defined to be run fron the terminal
*/
gulp.task('scripts', ['js', 'vendor_js', 'compile_dist']);
gulp.task('styles', ['vendor_css', 'ionic_sass', 'sass', 'compile_css']);
gulp.task('default', ['copy', 'scripts', 'styles']);
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="css/app.min.css" rel="stylesheet">
</head>
<body ng-app="app">
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">Ionic Blank Starter</h1>
</ion-header-bar>
<ion-content>
</ion-content>
</ion-pane>
</body>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
</html>
Raw
main.js
(function() {
"use strict";
angular.module('app', ['ionic']);
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment