knisterpeter / tscodeshift

tscodeshift is a toolkit for running codemods over multiple TS files

tscodeshift

tscodeshift is a toolkit for running codemods over multiple TS files. It borrows its ideas from jscodeshift in a shameless manner.

Usage

  Usage: tscodeshift <path>... [options]

  path     Files or directory or glob to transform

  Options:
    -t FILE, --transform FILE   Path to the transform file. Can be either a local path or url  [./transform.js]
    -d, --dry                   Dry run (no changes are made to files)
    -p, --print                 Print output, useful for development

Example

Convert mocha tests to jest tests:

$ npm install tscodeshift
$ ./node_modules/.bin/tscodeshift -t ./node_modules/tscodeshift/dist/src/transforms/mocha.js 'tests/**/*.ts'

tscodeshift's Issues

how to add code without replaceWith()

Hello,
I'm try to figure how can I append code since I don't have code to replace
so I can't use replaceWith method
(I need to add a static prop to a class)
Is it something do-able ?

Feature Request: Support use as a transform module

Thanks for an awesome project, should really help out what I am working on. I am looking for a drop in replacement for JSCode's transform module. FYI - this is the behaviour I am looking to replicate for TS.

I am more than happy to help contribute if required. Let me know what you think.

Many transforms cause invalid code to be generated

Hi there!

Thanks for creating tscodeshift! I'm currently using it to try port a very large code base over to TypeScript and so far it's working really well... for the most part anyway.

I traced down and think I understand the issue. It is somewhat related to #24 but unfortunately sums down to a design flaw in ts-emitter that is not easily solvable. The solution I am currently using is a number of hacks[1] that generate valid (though ugly) code... and then pass it through prettier to clean it up.

Essentially the problem is the use of source context position in ts-emitter. If you do any modification on nodes or any partial modification it creates a situation where context no longer accurately reflects the actual position in the source code. The addWhitespace function then will add (or not) whitespace based on the wrong location. Usually this is just a styling issue, but in cases such as missing whitespace (letx = 5;) or a newline after a return it actually changes the behavior. This also affects the addComma/addSemicolon functions.

I tried to fix it, but unfortunately it seems like a much larger change. One would be to drop the context and instead use node.getFullStart / node.getStart / etc... but unfortunately that might make it hard to generate identical source code.

Another option (and preferable for my use case) is if ts-emitter/codeshift could generate syntactically correct source with comments, and then integrate directly into prettier for the formatting.

If you want to see the issues yourself you can run my (reasonably incomplete) js=>ts codeshift on any sufficiently complicated source code.

[1] Pushed hacks at https://github.com/qix/ts-emitter/commit/9ad86b493afe8240b9e05d2b3fb14874c99a2765 for your reference
[2] https://github.com/KnisterPeter/ts-emitter/blob/master/src/utils.ts#L44
[3] https://gist.github.com/qix/393f57cce9994185e2136d50eabcc733

examples folder

Hey @KnisterPeter,

I've been digging the latest version of tscodeshift a bunch, it's doing exactly what I want. 🎉

I was wondering whether you think it would be valuable to have an examples / transforms folder where some simple / common recipes are layed out?

I wrote a very simple transformer to cut my teeth on this library, but I could've used some guidance instead of debugging. (and right now it fails hilariously on some files)

I'd be more than happy to help with this task if you think it'd be valuable. (Perhaps there's an alternative like publishing tscodeshift-transformer-x if you don't want to dirty up this repo with those examples.)

Please let me know.

Thanks!

Action required: Greenkeeper could not be activated 🚨

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because we are using your CI build statuses to figure out when to notify you about breaking changes.

Since we did not receive a CI status on the greenkeeper/initial branch, we assume that you still need to configure it.

If you have already set up a CI for this repository, you might need to check your configuration. Make sure it will run on all new branches. If you don’t want it to run on every branch, you can whitelist branches starting with greenkeeper/.

We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

using createLiteral to populate as ts.createArrayLiteral() throw an error

using

ast.find(ts.SyntaxKind.PropertyDeclaration)
    .filter(p => p.name.text === '$inject')
    .get(node => node.initializer) 
    .replaceWith(() =>  ts.createArrayLiteral(props.map(prop => ts.createLiteral(prop))) 
    .toSource()

throw a TypeError: Cannot read property 'getFullText' of undefined

I'm trying to populate the $inject array with constructor parameters like
static $inject:string[] = ['titi', 'toto']

import {  User } from './user';
export class TestClass { 
  static $inject:string[] = [] 

  constructor(
    private titi: User,
    private toto: User
  ) {}
}

here is the full transform file for reference

const ts = require('typescript')

exports.default = (file, api) => {
  const t = api.tscodeshift;
  const ast = t(file.source); 

  const props =  []

  ast.find(ts.SyntaxKind.Parameter)
    .filter( p => p.parent.kind === ts.SyntaxKind.Constructor) 
    .forEach(p => props.push(p.name))

  ast.find(ts.SyntaxKind.PropertyDeclaration)
    .filter(p => p.name.text === '$inject')
    .get(node => node.initializer) 
    .replaceWith(() =>  ts.createArrayLiteral(prop => ts.createLiteral(prop)))
    
  return ast.toSource() 
} 

Collection.remove() implementation

I'm looking for a quick way to remove the nodes in a collection from the AST.

For example,

root.find(ts.SyntaxKind.CallExpression, { name: 'x' }).remove();

I'm coming over from jscodeshift and was excited to find tscodeshift! If there is another way that I'm missing to remove specific nodes, please let me know.