Add command to import/export to AST Explorer...

[rwjblue]

No description provided.

[rajasegar]

I am planning to work on import and export, before that I need some clarfications.

The import can work for two ways:

1. Create new project by importing from ast-explorer (Global command)

codemod-cli new <project-name> --import <ast-explorer-url> --codemod <codemod-name>

2. Import a transform from ast-explorer (Local command)
   Inside a project to generate a codemod from the url.

codemod-cli import <ast-explorer-url> <codemod-name>

One more caveat is that the transform from ast-explorer will look like this:

// Press ctrl+space for code completion
export default function transformer(file, api) {
  const j = api.jscodeshift;

  return j(file.source)
    .find(j.Identifier)
    .forEach(path => {
      j(path).replaceWith(
        j.identifier(path.node.name.split('').reverse().join(''))
      );
    })
    .toSource();
}

But the codemod-cli generates the default transform like this:

      const { getParser } = require('codemod-cli').jscodeshift;
      const { getOptions } = require('codemod-cli');

      module.exports = function transformer(file, api) {
        const j = getParser(api);
        const options = getOptions();

        return j(file.source)
          .find(j.Identifier)
          .forEach(path => {
            path.node.name = path.node.name
              .split('')
              .reverse()
              .join('');
          })
          .toSource();
      }

I think we need to do some modification after importing , can we let the codemod author make the changes on his own?
@rwjblue Your thoughs?

[rajasegar]

In case of export also, we can have something like:

1. Export a transform with just plain export command invoked from a transform folder

$ cd transforms/sample
$ codemod-cli export

2. Or from the project root with the name option:

$ codemod-cli export <codemod-name>

And for the source file we need to figure which test fixture we need to export, is it the basic.input.js or with the second variation we can do like this:

$ codemod-cli export <codemod-name> <test-fixture-name>

test-fixture-name will be used for the contents of the source.js file for the ast-explorer

[rwjblue]

The import can work for two ways:

I’d start with the first thing (import as a means to generate a new project), but we should be able to add both fairly easily if we factor the code well enough. Then we’d also want a way to update the codemod after the initial import (e.g. the author makes tweaks to the astexplorer side and wants to sync them back to the local project).

I think we need to do some modification after importing , can we let the codemod author make the changes on his own?

Sure, I think that is fine. But I also think we could fairly easily make a transform we run for them after downloading.

Also, we could make transforms support ES modules (via esm package), but we can do that as a separate feature.

[rajasegar]

I am changing the --import option in the first variation for new command to --url, since import is a key-word and the linter is throwing errors when I am parsing the options.
Hence the new command format will look like:

codemod-cli new <project-name> --url <ast-explorer-url> --codemod <codemod-name>

[rwjblue]

Gotcha, sounds good to me

[rajasegar]

I tried to implement export also, but I met with a problem of gist revisions not able to identify properly with ast-explorer. You can see the error if you try this:
https://astexplorer.net/#/gist/5061c7fcf47f69e5781ca6b0989b777c

[rajasegar]

Looks like ast explorer is not able to read my gists (from my account), it is only accepting gists from here
https://gist.github.com/astexplorer
like this one
https://gist.github.com/97a64dc2d11ac885e669dff4d0f58a79/cf6cca3e88ff0d6f091efe8704a585b5591af0f3

[rajasegar]

Mapping out tasks for export here for future reference:

• Test cases for export command (local)
• Fix errors with export in ast-explorer
• Update README with the export command info