Coder Social home page Coder Social logo

grunt-jsbeautifier's Introduction

grunt-jsbeautifier Gittip Build Status NPM

jsbeautifier.org for grunt

Getting Started

This plugin recommends using Grunt ~0.4.1. Grunt ~0.3.0 is only suported till version 0.1.4

If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

Grunt ~0.4.1

npm install grunt-jsbeautifier --save-dev

One the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:

grunt.loadNpmTasks('grunt-jsbeautifier');

Grunt ~0.3.0

Install this grunt plugin next to your project's grunt.js gruntfile with:

npm install [email protected]

Then add this line to your project's grunt.js gruntfile:

grunt.loadNpmTasks('grunt-jsbeautifier');

Examples

Single Task

  • files (required): Your source files to beautify
  • options (optional): Overwrite default jsbeautifier options
"jsbeautifier" : {
    files : ["src/**/*.js"],
    options : {
    }
}

Multi Task

  • src (required): Your source files to beautify
  • options (optional): Overwrite default jsbeautifier options
"jsbeautifier" : {
    "default": {
        src : ["src/**/*.js"]
    },
    "git-pre-commit": {
        src : ["src/**/*.js"],
        options : {
            mode:"VERIFY_ONLY"
        }
    }
}

Config

files

Type: Files Default value: []

List of files to be beautified. This option is applicable only for Single Task

src

Type: Files Default value: []

List of files to be beautified. This option is applicable only for Multi Task

options.mode (optional)

Type: String Default value: VERIFY_AND_WRITE

If mode is "VERIFY_ONLY", then task will fail if at least one file can be beautified. This is useful for pre-commit check.

options.dest (optional)

Type: String Default value: ''

All beautified file will be stored under "dest".

options.jsbeautifyrc (optional)

Type: String or true Default value: null

Alias: options.config (for version < 0.2.7)

If set to true, config will be sent to jsbeautify from .jsbeautifyrc files relative to the flies being beautified.

If a filename is specified, options and globals defined therein will be used. The jsbeautifyrc file must be valid JSON and looks like the one supported by js-beautify itself.

Default options from js-beautify can be used

  "jsbeautifier": {
      files: ["src/**/*.js"],
      options: {
          config: "path/to/configFile",
          html: {
              braceStyle: "collapse",
              indentChar: " ",
              indentScripts: "keep",
              indentSize: 4,
              maxPreserveNewlines: 10,
              preserveNewlines: true,
              unformatted: ["a", "sub", "sup", "b", "i", "u"],
              wrapLineLength: 0
          },
          css: {
              indentChar: " ",
              indentSize: 4
          },
          js: {
              braceStyle: "collapse",
              breakChainedMethods: false,
              e4x: false,
              evalCode: false,
              indentChar: " ",
              indentLevel: 0,
              indentSize: 4,
              indentWithTabs: false,
              jslintHappy: false,
              keepArrayIndentation: false,
              keepFunctionIndentation: false,
              maxPreserveNewlines: 10,
              preserveNewlines: true,
              spaceBeforeConditional: true,
              spaceInParen: false,
              unescapeStrings: false,
              wrapLineLength: 0
          }
      }
  },

Only specifiy options to overwrite.

NOTE: All options can be specified similar to js-beautify using underscore.

FAQ/Tips

1. Exclude files

All files from foo folder except bar.js

jsbeautifier: {
    files: ['foo/*.js', '!foo/bar.js']
}

2. Use specific version of js-beautify

If you want use specific version of js-beautify instead of latest, please refer to npm shrinkwrap

3. Beautify files other than js, json, css & html

If you need to beautify files other than js, json, css & html, it can be done by passing fileTypes.

For example, beautifying '.js.erb' files along with '.js', beautifying '.less' files along with '.css', beautifying '.html.erb' files along with '.html'.

jsbeautifier: {
    files: ['foo/css/*.css', 'bar/css/*.less', 'foo/js/*.js', 'bar/js/*.js.erb', 'foo/html/*.html', 'bar/html/*.html.erb'],
    options: {
        js: {
            fileTypes: ['.js.erb']
        },
        css: {
            fileTypes: ['.less']
        },
        html: {
            fileTypes: ['.html.erb']
        }
    }
}

Release History

  • 0.2.7: Use latest dependencies without throwing "latest" keyword warning, 35
  • 0.2.6: Bumped version after for changing dist to dest
  • 0.2.5: Support dist folder and show all failed files in VERIFY_MODE 22, 24, 25
  • 0.2.4: Support custom file types other than js, json, css & html. Use latest versions for dependencies 23, 26
  • 0.2.3: Always use latest version of js-beautify. 21
  • 0.2.2: Configuration is now lint happy. Options can be specified in cameCase, 17
  • 0.2.1: Added Support for flat config file
  • 0.2.0: Added support for css, html and json files
  • 0.1.10: Added verify only mode 15. This will fail if any file needs beautification.
  • 0.1.9: Upgraded js-beautify to 1.4.0. Fixed issues 13
  • 0.1.8: Upgraded js-beautify to ~1.3.1. Fixed issues 10, 12
  • 0.1.7: Upgraded grunt to ~0.4.1, js-beautify to ~1.2.0. Fixed issues 6, 7, 8, 9
  • 0.1.6: Make sure new line at the end of file. Fixed issue 5
  • 0.1.5: Upgraded to grunt ~0.4.0. Fixed issues 2, 3, 4
  • 0.1.4: Upgraded js-beautify to latest version (0.3.2)
  • 0.1.3: Added fix for block comment formatting.
  • 0.1.2: Supported grunt 0.4~.
  • 0.1.1: Readme file changes
  • 0.1.0: Initial version.

License

Copyright (c) 2012 Vishal Kadam Licensed under the MIT license.

grunt-jsbeautifier's People

Contributors

vkadam avatar blai avatar mitermayer avatar bartvds avatar davdiv avatar johnkpaul avatar bitwiseman avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.