jscodeshift
jscodeshift copied to clipboard
can I run jscodeshift as a REPL?
The closest thing we have to a REPL at the moment is https://astexplorer.net/. You can select jscodeshift from the "Transform" drop down. AST Explorer lets you edit a transform and see how the output changes as you edit it.
Not directly, but you can use it with node (using App.js from create-react-app as an example):
$ node
Welcome to Node.js v16.14.2.
Type ".help" for more information.
> const j = require('jscodeshift');
undefined
> const root = new j(fs.readFileSync('./App.js').toString())
undefined
> root
Collection {
_parent: undefined,
__paths: [
NodePath {
value: [Node],
parentPath: null,
name: null,
__childCache: null
}
],
_types: [ 'File', 'Node', 'Printable' ]
}
> root.find(j.JSXElement, {openingElement: {name: {name: 'p'}}}).paths()[0]
<ref *1> NodePath {
value: Node {
type: 'JSXElement',
start: 211,
end: 286,
loc: SourceLocation {
start: [Position],
end: [Position],
filename: undefined,
identifierName: undefined,
lines: [Lines],
tokens: [Array],
indent: 8
},
openingElement: Node {
type: 'JSXOpeningElement',
start: 211,
end: 214,
loc: [SourceLocation],
name: [Node],
attributes: [],
selfClosing: false
},
closingElement: Node {
type: 'JSXClosingElement',
start: 282,
end: 286,
loc: [SourceLocation],
name: [Node]
},
children: [ [Node], [Node], [Node] ]
},
parentPath: NodePath {
value: [
[Node], [Node],
[Node], [Node],
[Node], [Node],
[Node]
],
parentPath: NodePath {
value: [Node],
parentPath: [NodePath],
name: 1,
__childCache: [Object: null prototype]
},
name: 'children',
__childCache: [Object: null prototype] {
'0': [NodePath],
'1': [NodePath],
'2': [NodePath],
'3': [Circular *1],
'4': [NodePath],
'5': [NodePath],
'6': [NodePath]
}
},
name: 3,
__childCache: [Object: null prototype] {
type: NodePath {
value: 'JSXElement',
parentPath: [Circular *1],
name: 'type',
__childCache: null
},
openingElement: NodePath {
value: [Node],
parentPath: [Circular *1],
name: 'openingElement',
__childCache: [Object: null prototype]
},
closingElement: NodePath {
value: [Node],
parentPath: [Circular *1],
name: 'closingElement',
__childCache: [Object: null prototype]
},
children: NodePath {
value: [Array],
parentPath: [Circular *1],
name: 'children',
__childCache: [Object: null prototype]
}
}
}
> j(root.find(j.JSXElement, {openingElement: {name: {name: 'p'}}}).paths()[0])
Collection {
_parent: undefined,
__paths: [
NodePath {
value: [Node],
parentPath: [NodePath],
name: 3,
__childCache: [Object: null prototype]
}
],
_types: [ 'JSXElement', 'Expression', 'Node', 'Printable' ]
}
> j(root.find(j.JSXElement, {openingElement: {name: {name: 'p'}}}).paths()[0]).toSource()
'<p>\n Edit <code>src/App.js</code> and save to reload.\n</p>'
>