astexplorer icon indicating copy to clipboard operation
astexplorer copied to clipboard

feature: add putout

Open coderaiser opened this issue 6 years ago • 2 comments

Thank you for such a useful tool as AST Explorer :), it helped me a lot to learn what JavaScript AST consists from and how to interact with. Also it helps me a lot to work on Pluggable Code Transformer Putout. This is something like eslint but it works not with formatting but with code, for example it can help you to replace such code:

function merge(a) {
-   return Object.assign({}, a, {
-       hello: 'world'
-   });
+   return {
+       ...a,
+       hello: 'world'
+   };
};

It consists of babel and recast and this provides a lot flexibility with AST-manipulation and transform only code that matters, keeping untouched everything else. And the most important and powerful thing is it plugins. There is no built-in rules (in it's core), everything is a plugin and only public API used.

Putout uses similar but little bit different then babel plugin structure:

const {
  types,
} = require('putout');

// when find node that can be fixed tell about it 
module.exports.report = ({path}) => `identifier ${path.node.name} should be reversed`;

// this part will run only when `putout --fix` will be used
module.exports.fix = ({path}) => {
  path.node.name = path.node.name.split('').reverse().join('');
};

// this part used for search
module.exports.traverse = ({push}) => {
  return {
    Identifier(path) {
      push({path})
    }
  };
};

Would be great if putout plugins could be created from https://astexplorer.net, this would be very useful :), for me and putout plugin developers.

coderaiser avatar Jun 18 '19 17:06 coderaiser

Would it make sense to make putout plugins also serve as babel plugins? Then you could use them as-is.

eventualbuddha avatar Aug 08 '19 00:08 eventualbuddha

@eventualbuddha, unfortunately no, because babel plugins only transform, and not report. Putout can find, fix and report, this is a thing which is similar in putout and eslint(but putout has a more simple api with less nested objects).

Anyways putout supports babel and jscodeshift plugins in a slower and more limited mode then native plugins.

coderaiser avatar Aug 08 '19 13:08 coderaiser