Skip to content

Grunt task which removes code blocks based on environment configuration

Notifications You must be signed in to change notification settings

livedata/grunt-devcode

Folders and files

NameName
Last commit message
Last commit date

Latest commit

author
Krzysztof Antczak
Feb 4, 2015
7c7326e · Feb 4, 2015

History

20 Commits
Jan 8, 2013
Nov 23, 2014
Jan 8, 2013
Jan 8, 2013
Nov 23, 2014
Nov 23, 2014
Nov 12, 2013

Repository files navigation

Devcode v.0.0.4 Dependency Status

Changelog: v.0.0.4 - removed grunt-env dependency, changed configuration, devcode now supports 'grunt server' v.0.0.3 - upgraded grunt dependency

Usage with Yeoman grunt file:

Devcode is a fork of grunt-preprocess project, which has been re-written from scratch at the end. Due to the problems I had with that library, along with an excessive amount of code (additional dependency from "preprocess") and I suppose not fully tested functionality.

Installation:

  npm install grunt-devcode

Loading devcode into grunt

  grunt.loadNpmTasks('grunt-devcode');

Little watch task (livereload section) change:

  livereload: {
    files: [
      '<%= yeoman.app %>/{,*/}*.html',
      '{.tmp,<%= yeoman.app %>}/styles/{,*/}*.css',
      '{.tmp,<%= yeoman.app %>}/{,*/}*.php',
      '{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js',
      '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg}'
    ],
    tasks: ['devcode:server','livereload']
  }

We have added a 'devcode' task with 'server' environment. It is important to add this one before 'livereload'.

Server task configuration

  grunt.registerTask('server', [
    'clean:server',
    'devcode:server', // devcode before coffee or whatever You like, but using 'server' section.
    'coffee:dist',
    'compass:server',
    'livereload-start',
    'connect:livereload',
    'open',
    'watch'
  ]);

Build task configuration

  grunt.registerTask('build', [
    'clean:dist',
    'jshint',
    'test',
    'coffee',
    'compass:dist',
    'useminPrepare',
    'imagemin',
    'cssmin',
    'htmlmin',
    'concat',
    'copy',
    'devcode:dist', // devcode after 'copy', or whatever You like if You know what are You doing.
    'cdnify',
    'usemin',
    'ngmin',
    'uglify'
  ]);

Devcode configuration:

    devcode :
    {
      options :
      {
        html: true,        // html files parsing?
        js: true,          // javascript files parsing?
        css: true,         // css files parsing?
        php: true,         // php files parsing?
        clean: true,       // removes devcode comments even if code was not removed
        block: {
          open: 'devcode', // with this string we open a block of code
          close: 'endcode' // with this string we close a block of code
        },
        dest: 'dist'       // default destination which overwrittes environment variable
      },
      server : {           // settings for task used with 'devcode:server'
        options: {
            source: '<%= yeoman.app %>/',
            dest: '.tmp/',
            env: 'development'
        }
      },
      dist : {             // settings for task used with 'devcode:dist'
        options: {
            source: 'dist/',
            dest: 'dist/',
            env: 'production'
        }
      }
    },

Devcode usage (html files):

<!-- devcode: !production -->
  <li class="right"><a href="#settings" data-toggle="tab">Settings</a></li>
<!-- endcode -->

this code will show for all environment types but production

Devcode usage (js, css and php files):

// devcode: !production
  body {
    background-color: red;
  }
// endcode

this code will show for all environment types but production

Test server

  grunt server

Test build

  grunt build

Todo

- Tests