manuelstofer / esformatter-align Goto Github PK

View Code? Open in Web Editor NEW

0.0 3.0 1.0 20 KB

esformatter alignment plugin

JavaScript 100.00%

esformatter-align's Introduction

esformatter-align

esformatter plugin for alignment.

Usage

install it:

npm install esformatter-align

and add to your esformatter config file:

{
  "plugins": [
    "esformatter-align"
  ]
}

Alignments

VariableDeclarations

input:

var longer = require('hello');
var small = require('hello');
var muchlonger = require('hello');

output:

var longer     = require('hello');
var small      = require('hello');
var muchlonger = require('hello');

ObjectExpressions

input:

var x = {
  a: 5,
  bla: ''
};

output:

var x = {
  a:   5,
  bla: ''
};

AssignmentExpressions

input:

foo = 'bar';
fooooooo = 'baz';

output:

foo      = 'bar';
fooooooo = 'baz';

TernaryExpression

input:

foo ? x : 'bar';
fooooooo ? y : 'baz';

output:

foo      ? x : 'bar';
fooooooo ? y : 'baz';

OrExpression

input:

foo || x || 'bar';
fooooooo || yy || 'baz';

output:

foo      || x  || 'bar';
fooooooo || yy || 'baz';

SpreadAlignment, ShorthandAlignment

The object spread operator and shorthand can either be aligned with the keys (default) or with the values.

input:

var y = { blu: 1 };
var z = true;
var x = {
z,
    ...y,
 bla: 5
};

output (default: keys):

var y = {
  blu: 1
};
var x = {
  z,
  ...y,
  bla: 5
};

output (option: value):

var y = {
  blu: 1
};
var x = {
       z,
       ...y,
  bla: 5
};

Config

Optionally disable alignment of specific expressions and set some other options

{
  "esformatter": {
    // ...
  },
  "indent": {
    // ...
  },
  "align": {
    "ObjectExpression":     1,
    "VariableDeclaration":  1,
    "AssignmentExpression": 1,
    "TernaryExpression":    0,
    "OrExpression":         0,
    "SpreadAlignment":      "key", // optional: "value"
    "ShorthandAlignment":   "key"  // optional: "value"
  },
  // ...
}

License

Released under the MIT License.

esformatter-align's People

Contributors

Watchers

Forkers

simon-jentzsch

esformatter-align's Issues

Add config option for colon alignment in object declaration

You have output looking like this:

{
  fieldName1:          value
  fieldNameOther:      value
  fieldName2:          value
  fieldNameOther2:     value
}

But I much prefer this:

{
  fieldName1           : value
  fieldNameOther       : value
  fieldName2           : value
  fieldNameOther2      : value
}

Because I think the vertical line created by the colon creates a greater visual distinction between
arrays and values.

Could this be a configurable option, please?

Object spread alignment

Opening this because I'm not sure what the behaviour should be for alignment with the experimental object spread operator.

Input source:

const variable = {
  ...user,
  avatar: 'http://www.example.com/something'
};

Output source:

const variable = {
  ...     user,
  avatar: 'http://www.example.com/something'
};

Expected?

const variable = {
  ...user,
  avatar: 'http://www.example.com/something'
};

ObjectAlignment on Colon

When aligning Assignments the '=' sign is well aligned:

const Promise = require('bluebird')
const db      = require('./db')
const lib     = require('./lib')
const cron    = require('./cron')
const common  = require('../utils/common')
const eth     = require('../utils/eth')
const pg      = require('./postgres')

but when I align Objects, the ':'-sign is attached to the keys, but not aligned:

{
  user: {
    address:           user.address,
    notificationToken: getNotificationToken(user.authentification)
  },
  connector:     connector,
  secondstorent: secondsToRent,
  confirmed:     confirmed || false
}

But I would rather have it aligned the same way:

{ 
  user          : {
    address           : user.address,
    notificationToken : getNotificationToken(user.authentification)
  },
  connector     : connector,
  secondstorent : secondsToRent,
  confirmed     : confirmed || false
}

Is there a easy way to support this (like Webstorms 'Align on Colon')

question about config

Im a newbie to esformatter and I don't understand the config format

If I have this:

{
  "plugins": [
    "esformatter-align"
  ]
}

how do I add this:

{
  "esformatter": {
    // ...
  },
  "indent": {
    // ...
  },
  "align": {
    "ObjectExpression":     1,
    "VariableDeclaration":  1,
    "AssignmentExpression": 1,
    "TernaryExpression":    0,
    "OrExpression":         0,
    "SpreadAlignment":      "key", // optional: "value"
    "ShorthandAlignment":   "key"  // optional: "value"
  },
  // ...
}

Should I put the configuration in a esformatter.json, or can I also put this in a package.json

Thanks.

Declaration line euqal sign is missaligned

If I have following example
var formulaGroup = "TEST",
gridItems = "TEST1",
itemIds = {},
newItems = [],
compare = true;

ends up like this (equal sign on declaration line is 3 positions left)

var formulaGroup = "TEST",
gridItems = "TEST1",
itemIds = {},
newItems = [],
compare = true;

Inconsistency when indenting when values are wrapped in parenthesis

Input:

            me.setProperties({
                latestUrlFilter:    (filter && filter.trim() !== '' ? filter : '*'),
                latestFilter:       (filter === '*' ? null : filter)
            });

Output:

                me.setProperties({
                    latestUrlFilter: (filter && filter.trim() !== '' ? filter : '*'),
                    latestFilter: (  filter === '*' ? null : filter)
                });

Entire indent increasing by 4 spaces is OK, but the parenthesis messed up (not aligned and separated from the expression on the second property by two spaces).

Ran esformat again on the same file (interestingly adds one more space behind the opening parenthesis on the second property):

                 me.setProperties({
                     latestUrlFilter: (filter && filter.trim() !== '' ? filter : '*'),
                     latestFilter: (   filter === '*' ? null : filter)
                 });

Another example.

Input:

[SDC.Tracking.categories.alerting.groupByProp,                         (this.get('model.groupBy') ? this.get('model.groupBy').join(', ') : 'none')]

Expected the space between , ( to go away but didn't happen. If no parenthesis are used to wrap values, everything is OK.

manuelstofer / esformatter-align Goto Github PK

esformatter-align's Introduction

esformatter-align

Usage

Alignments

VariableDeclarations

ObjectExpressions

AssignmentExpressions

TernaryExpression

OrExpression

SpreadAlignment, ShorthandAlignment

Config

License

esformatter-align's People

Contributors

Watchers

Forkers

esformatter-align's Issues

Recommend Projects

Recommend Topics

Recommend Org