diff --git a/README.md b/README.md index 3f495db..2e48feb 100644 --- a/README.md +++ b/README.md @@ -6,12 +6,10 @@ [![Code Climate](https://codeclimate.com/github/FuelFrontend/generator-smacss/badges/gpa.svg)](https://codeclimate.com/github/FuelFrontend/generator-smacss) --> -[Work In Progress] Perfectionist generator that scaffolds out different types of Frontend application +Perfectionist generator that scaffolds out different types of Frontend application ![Generator Smacss](https://raw.githubusercontent.com/FuelFrontend/generator-smacss/master/smacss-in-action.png "Generator Smacss") -![Join the chat at https://gitter.im/FuelFrontend/generator-smacss]() - # Features diff --git a/app/index.js b/app/index.js index f654dd6..347ae06 100644 --- a/app/index.js +++ b/app/index.js @@ -249,7 +249,12 @@ smacssGenerator.prototype.copyJSFiles = function copyJSFiles() { }; smacssGenerator.prototype.copyDependencyFiles = function copyDependencyFiles() { - this.template("_" + this.appType + "/_gulpfile.js", this.appName + "/gulpfile.js", smacssGenerator.context); + if(this.appType === 'typeFullPackWebApp' || this.appType === 'typeAngularApp') { + this.template("common/_gulpfile.js", this.appName + "/gulpfile.js", smacssGenerator.context); + } + else { + this.template("_typeSimpleWebApp/_gulpfile.js", this.appName + "/gulpfile.js", smacssGenerator.context); + } this.template("_" + this.appType + "/_package.json", this.appName + "/package.json", smacssGenerator.context); }; diff --git a/app/templates/_typeFullPackWebApp/_gulpfile.js b/app/templates/_typeFullPackWebApp/_gulpfile.js deleted file mode 100644 index b728cca..0000000 --- a/app/templates/_typeFullPackWebApp/_gulpfile.js +++ /dev/null @@ -1,321 +0,0 @@ -'use strict'; -/*----------------------------------------------------------- - GULP: DEPENDENCIES - Define the variables of your dependencies in this section ------------------------------------------------------------*/ -var gulp = require('gulp'), - del = require('del'), - open = require('open'), - chalk = require('chalk'), - gulpIf = require('gulp-if'), - sass = require('gulp-sass'), - concat = require('gulp-concat'), - browserSync = require('browser-sync'), - runSequence = require('run-sequence'), - jshintStylish = require('jshint-stylish'), - fileInclude = require('gulp-file-include'), - mainBowerFiles = require('main-bower-files'), - sourcemaps = require('gulp-sourcemaps'), - filter = require('gulp-filter'), - gulploadPlugins = require('gulp-load-plugins'); - -var plugins = gulploadPlugins(); - -var filterByExtension = function(extension){ - return filter(function(file){ - return file.path.match(new RegExp('.' + extension + '$')); - }); -}; - -/*----------------------------------------------------------- - GULP: APP CONFIGURATION - Source, Build folder and other application configuration ------------------------------------------------------------*/ -// Source Path -var src = { - root : 'app', - css : 'app/css', - scss : 'app/scss', - js : 'app/js', - images : 'app/images', - fonts : 'app/fonts', - bower : './bower_components', - zip : './zip' -}; - -// Build Path -var build = { - root : 'build', - css : 'build/css', - js : 'build/js', - images : 'build/images', - fonts : 'build/fonts' -}; - -// Server Configuration -var serverConfiguration = { - host : 'localhost', - port : 3000, - livereload : true, - open : true -}; - -// Default production mode set to false -var production = false; - -// Bower Configuration -var bowerConfiguration = { - paths: { - bowerDirectory : src.bower, - bowerrc : '.bowerrc', - bowerJson : 'bower.json' - } -}; - -// Minification options for HTML -var opts = { - comments : false, - quotes : true, - spare : true, - empty : true, - cdata : true -}; - -// Chalk config -var error = chalk.red.bold, - warning = chalk.black.bold.bgYellow, - update = chalk.yellow.underline, - success = chalk.green; - -/*----------------------------------------------------------- - GULP : APP TASKS - Necessary gulp tasks required to run your application like - magic. Feel free to add more tasks in this area ------------------------------------------------------------*/ -/*=========================================================== - GULP : APP TASKS :: Start server and live reload -===========================================================*/ - -gulp.task('server', function () { - - console.log(update('\n--------- Server started at http://localhost:'+ serverConfiguration.port +' ------------------------\n')); - return gulp.src('build') - .pipe(plugins.webserver(serverConfiguration)); -}); - -/*=========================================================== - GULP : APP TASKS :: HTML -- Minify html to build -===========================================================*/ - -gulp.task('html', function () { - - console.log(update('\n--------- Running HTML tasks ------------------------------------------\n')); - return gulp.src([src.root + '/*.html', src.root + '/**/*.html']) - .pipe(plugins.fileInclude({ - prefix: '@@', - basepath: '@file' - })) - .pipe(gulpIf(production, plugins.minifyHtml(opts))) - .pipe(plugins.size()) - .pipe(gulp.dest(build.root)); -}); - -/*=========================================================== - GULP : APP TASKS :: CSS & SASS -- minify, concat -===========================================================*/ - -var callback = function (err) { - console.log(error('\n--------- SASS file has error clear it to see changes, check the log below -------------\n')); - console.log(error(err)); -}; - -gulp.task('sass', function () { - - console.log(update('\n--------- Running SASS tasks -------------------------------------------')); - return gulp.src(['app/scss/master.scss']) - .pipe(plugins.sass({ onError: callback })) - .pipe(plugins.size()) - .pipe(gulp.dest(src.css)); -}); - -gulp.task('fonts', function () { - - console.log(update('\n--------- Running Fonts tasks --------------------------------------------\n')); - return gulp.src([src.fonts + '/*.*', src.fonts + '/**/*.*']) - .pipe(plugins.size()) - .pipe(gulp.dest(build.fonts)); -}); - -gulp.task('css', ['sass', 'fonts'], function () { - - console.log(update('\n--------- Running CSS tasks --------------------------------------------\n')); - return gulp.src([src.css + '/**/*.css']) - .pipe(gulpIf(production, plugins.minifyCss())) - .pipe(plugins.concat('master.css')) - .pipe(plugins.size()) - .pipe(gulp.dest(build.css)); -}); - -/*=========================================================== - GULP: APP TASKS :: Script -- js hint, uglify & concat -===========================================================*/ - -gulp.task('scripts', function () { - - console.log(update('\n--------- Running SCRIPT tasks -----------------------------------------\n')); - return gulp.src([src.js + '/*.js', src.js + '/**/*.js']) - .pipe(plugins.jshint('.jshintrc')) - .pipe(plugins.jshint.reporter(jshintStylish)) - .pipe(plugins.concat('application.js')) - .pipe(gulpIf(production, plugins.uglify())) - .pipe(plugins.size()) - .pipe(gulp.dest(build.js)); -}); - -/*=========================================================== - GULP: APP TASKS :: Images minification -===========================================================*/ - -gulp.task('img-min', function () { - - console.log(update('\n--------- Image Minification --------------------------------------------\n')); - return gulp.src([src.images + '/*.*', src.images + '/**/*.*']) - .pipe(plugins.imagemin()) - .pipe(plugins.size()) - .pipe(gulp.dest(build.images)); -}); - -/*=========================================================== - GULP: APP TASKS :: Watch -- all files -===========================================================*/ - -gulp.task('watch', function () { - - console.log(update('\n--------- Watching All Files -------------------------------------------\n')); - var HTML = gulp.watch(['app/*.html', 'app/**/*.html'], ['html']), - JS = gulp.watch(['app/*.js', 'app/js/**/*.js'], ['scripts']), - CSS = gulp.watch(['app/*.css', 'app/css/**/*.css'], ['css']), - SASS = gulp.watch(['app/*.scss', 'app/scss/**/*.scss'], ['css']), - FONTS = gulp.watch(['app/fonts/*.*', 'app/fonts/**/*.*'], ['fonts']), - IMG = gulp.watch(['app/images/*.*', 'app/images/**/*.*'], ['img-min']), - BOWER = gulp.watch(['bower_components/**/*.*', 'bower_components/**/**', 'bower.json'], ['concat-bower']); - - var log = function (event) { - if (event.type === 'deleted') { - runSequence('clean'); - setTimeout(function () { - runSequence('html', 'scripts', 'css', 'watch'); - }, 500); - } - console.log(update('\n--------- File ' + event.path + ' was ' + event.type + ' ------------------------\n')); - }; - - //on change print file name and event type - HTML.once('update', log); - CSS.once('update', log); - SASS.once('update', log); - JS.once('update', log); - IMG.once('update', log); - FONTS.once('update', log); - BOWER.once('update', log); -}); - -/*========================================================== - GULP: APP TASKS :: Bower file include -===========================================================*/ -gulp.task('bower', function() { - var mainFiles = mainBowerFiles(); - - if(!mainFiles.length){ - // No main files found. Skipping.... - return; - } - - var jsFilter = filterByExtension('js'); - - return gulp.src(mainFiles) - //For JS files - .pipe(jsFilter) - .pipe(sourcemaps.init({loadMaps : true})) - .pipe(concat('bower.js')) - .pipe(gulpIf(production, plugins.uglify())) - .pipe(gulpIf(production, sourcemaps.write('./'))) - .pipe(gulp.dest(build.js)) - .pipe(jsFilter.restore()) - - //For CSS files - .pipe(filterByExtension('css')) - .pipe(sourcemaps.init({loadMaps : true})) - .pipe(concat('bower.css')) - .pipe(gulpIf(production, plugins.uglify())) - .pipe(gulpIf(production, sourcemaps.write('./'))) - .pipe(gulp.dest(build.css)); -}); - -/*========================================================== - GULP: APP TASKS :: Browser sync to sync with browser -===========================================================*/ - -gulp.task('browser-sync', function () { - browserSync.init([build.root + '*/*.*', build.root + '**/*.*'], - { - server : { baseDir : './build' } - }); -}); - -/*----------------------------------------------------------- - GULP : ENVIRONMENT - Set your environment here, as of now it's development and - production. You can also include testing and staging ------------------------------------------------------------*/ -/*========================================================== - GULP: ENVIRONMENT :: Gulp build Tasks - dev, production -===========================================================*/ - -gulp.task('build', function () { - - console.log(update('\n--------- Build Development Mode --------------------------------------\n')); - runSequence('html', 'scripts', 'css', 'bower', 'server', 'watch'); -}); - -gulp.task('prod', function () { - - console.log(update('\n--------- Build Production Mode ---------------------------------------\n')); - production = true; - runSequence('html', 'scripts', 'css', 'bower', 'img-min', 'server', 'watch'); -}); - -/*========================================================== - GULP: ENVIRONMENT :: Gulp Default Tasks -- build -===========================================================*/ - -gulp.task('default', ['build']); - - -/*----------------------------------------------------------- - GULP : HELPERS - Quick tasks to make your life easier! ------------------------------------------------------------*/ - -// GULP: HELPERS :: List all gulp tasks -gulp.task('help', plugins.taskListing); - -// GULP: HELPERS :: Clean - remove files and folder in build -gulp.task('clean', function () { - console.log(update('\n--------- Clean:Build Folder ------------------------------------------\n')); - - del('build/', function (err) { - console.log(update('All are files deleted from the build folder')); - }); -}); - -// GULP: HELPERS :: Zip all build files with date -gulp.task('zip', function () { - var date = new Date().toDateString(); - - console.log(update('\n--------- Zipping Build Files ------------------------------------------\n')); - return gulp.src([build.root + '/**/*']) - .pipe(plugins.zip('<%= site_name %> - ' + date + '.zip')) - .pipe(plugins.size()) - .pipe(gulp.dest('./zip/')); -}); diff --git a/app/templates/_typeAngularApp/_gulpfile.js b/app/templates/common/_gulpfile.js similarity index 100% rename from app/templates/_typeAngularApp/_gulpfile.js rename to app/templates/common/_gulpfile.js diff --git a/package.json b/package.json index 0859a8d..6ef57d7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "generator-smacss", - "version": "0.2.0", + "version": "0.2.1", "description": "Perfectionist Frontend Generator", "author": { "name": "Logesh Paul", diff --git a/release.md b/release.md index 7042304..a21e8cd 100644 --- a/release.md +++ b/release.md @@ -1,5 +1,10 @@ # Release History +**v0.2.1** +- Improvements: Refactoring, Extracted Methods, Cleanup, Director structure update +- Readme file improvements and Better Favicon +- Included 404 Page + **v0.2.0** - Two great and good to have features included - Completely automated dependency installation, trigger local server, open the app in browser