Skip to main content

External Packages

This page covers creation of stand-alone Hypermod packages and is for authors who want:

  • Control over where and how your Hypermod package is hosted
  • Control over tooling, dependencies and techstack
  • The option to create completely generic codemods that don't target specific packages

If you prefer to not to maintain a separate package, please see the Authoring guide for other options.

Initializing

To create a standalone Hypermod package automatically, install the install and use the hypermod/cli.

  • npm: npm install -g @hypermod/cli or
  • yarn: yarn global add @hypermod/cli

Then given you want to initialize a new project called "foobar", with a codemod targeting version 10.0.0 you can run the following command:

$ hypermod init --package-name="foobar" --version="10.0.0" ~/Desktop

This will create a new directory called "foobar" in the ~/Desktop directory.

You can then also initialize subsequent transforms and presets by running the command again:

$ hypermod init --package-name="foobar" --preset="sort-imports" ~/Desktop

File structure

The file structure of your new hypermod package will look like this:

react-cool-library/
hypermod.config.js // main entrypoint containing configuration and references to your transforms
package.json
tsconfig.json
jest.config.js
codemods/
10.0.0/ // semver version
transform.ts // main logic (should contain a transformer)
transform.spec.ts // main tests
motions/ // utility directory

Testing

Now to test your transformer, run yarn test --watch.

See the Testing guide for help getting started with unit tests.

Publishing

Since your new hypermod package can simply be treated as an NPM package you can simply run npm version [patch\minor\major] and npm publish.

Your package will now be accessible via the hypermod/cli. Refer to the Consuming guide for information about how to run your new codemods.

Examples

Here are some helpful example of this setup working in the wild: