npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

ts-autofix

v1.0.0

Published

Automatically fix TS Errors when codefixes are available

Downloads

1,600

Readme

TS AutoFix

npm version

Automatically fix TS Errors when codefixes are available.

Usage

For most use cases you should be able to use ts-autofix directly through npx.

  • npx ts-autofix list from the root of your TS project will list available fixes.
  • npx ts-autofix will attempt to run all available fixes.

If your tsconfig is not at ./tsconfig.json, you should add arg --project <pathToTsConfig> to both commands.

You can also filter which fixes are applied by using the --fixes or --errors args.

| Argument | Description | | ---------|-------------| | --project | The path to your tsconfig file. e.g. npx ts-autofix [list] --project foo/tsconfig.json | | -f--fixes | The name of one or more TS fixes to apply. Use npx ts-autofix list to find available fixes. e.g. npx ts-autofix --fixes unusedIdentifier inferFromUsage | | -e--errors | The TypeScript error codes to look for fixes for. e.g. npx ts-autofix --errors TS6133 7006 | | --tsCliArgs | Additional CLI args for tsc to override compilerOptions. e.g. if you are trying to increase strictness of your project you might pass the additional compiler flag you are trying to enforce. e.g. npx ts-autofix [list] --tsCliArgs "--noImplicitAny" |

Advanced Usage

It's also possible to use ts-autofix as a library, which gives you more control over how it runs and applies fixes.

e.g.

import { tsAutoFix } from `ts-autofix`;

tsAutoFix({
  tsConfigPath: "foo/tsconfig.json",
  diagnosticsFilter: (diag) => diag.code === 6133,
});

The input to tsAutoFix is a configuration object of type TsAutoFixOptions.

type TsAutoFixOptions = {
  tsconfigPath: string;
  compilerOptionsOverrides?: ts.CompilerOptions;
  diagnosticsFilter?: (diagnostic: ts.Diagnostic) => boolean;
  codeFixFilter?: (codeFixAction: ts.CodeFixAction) => boolean;
  preprocessCodeChanges?: (changes: ts.TextChange[], sourceFile: ts.SourceFile, diagnostic: ts.Diagnostic) => ts.TextChange[];
};

| Option | Description | |--------|-------------| | tsconfigPath | (required) The path to your project's tsconfig.json. | | compilerOptionsOverrides | Optional overrides to the compilerOptions in your tsconfig. | | diagnosticsFilter | An optional callback to filter which TypeScript diagnostics/errors to attempt to find fixes for. If not defined, all diagnostics are used. Return true to include that diagnostic. | | codeFixFilter | An optional callback to filter which fixes to apply. If not defined, all fixes are applied. Return true to include that fix. | | preprocessCodeChanges | An optional callback to modify fixes before they are applied. This can return modified changes, or skip individual changes, but cannot modify sourceFile or diagnostic directly. |

For exaple, you could use preprocessCodeChanges to modify the suggested replacements so that line comments are preserved when removing a variable.

import { tsAutoFix } from "ts-autofix";
import type * as ts from "typescript"

const preprocessCodeChanges = (
  changes: ts.TextChange[],
  sourceFile: ts.SourceFile,
  diagnostic: ts.Diagnostic
): ts.TextChange[] => {
  for (const change of changes) {
    // If the change is purely a deletion
    if (!change.newText) {
      let { start, length } = change.span;
      const removedText = sourceFile.text.substring(start, start + length);

      // Skip leading line comments when removing code.
      const match = removedText.match(/^(\s*\/\/.*\r?\n)+/);
      if (match) {
        change.span.start += match[0].length;
        change.span.length -= match[0].length;
      }
    }
  }
  return changes;
};


tsAutoFix({
  tsConfigPath: "foo/tsconfig.json",
  preprocessCodeChanges
});