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

@unboundedsystems/tspoon

v1.0.460-unbounded.2

Published

AST visitors for TypeScript

Downloads

4

Readme

image

Tspoon (Unbounded Fork)

| Unbounded | Upstream | | --------- | -------- | | npm version | npm version |

AST visitors for Typescript.

API Reference

What Tspoon does

Typescript transpilation is usually source -> AST -> target. Tspoon uses Typescript's compiler API to allow pluggable pieces of logic (called visitor) to modify the AST before invoking the Typescript transpiler. The process will look like this source -> AST -visitors-> AST -> target. This technique enables early optimizations and error detection for custom language features.

In addition, Tspoon's validation api supports pre-validation code changes, allowing the developer to bypass otherwise unavoidable TypeScript diagnostics.

Users Documentation

Simple examples can be found here and here.

Getting started

Install tspoon using npm.

npm install tspoon

Currently, Tspoon exposes only a programmatic API. Meaning, it is used by other javacript code invoking it's transpile and validate methods.

tspoon.transpile(content, config)

content is a string containing the code to transpile, and config defines the visitors and transpilation parameters. The result is an instance of the TranspilerOutput interface, containing the transpiled code, a source map describing all changes done to the code, the diagnostics generated by the visitors and Typescript, and whether the operation failed or not.

// from src/transpile.ts
interface TranspilerOutput {
	code: string,
	sourceMap: RawSourceMap,
	diags: ts.Diagnostic[],
	halted: boolean
}
var tspoon = require('tspoon');
// from examples/poc/build.js
var config = {
    sourceFileName: 'src.ts',
    visitors: ... // insert visitors here
};
var sourceCode = fs.readFileSync(...);
var transpilerOut = tspoon.transpile(sourceCode, config);
...
fs.writeFileSync(path.join(__dirname, 'src.js'), transpilerOut.code, {encoding:'utf8'});

tspoon.validate()

Documentation pending writing

How to write a visitor

A visitor is an instance of the visitor interface:

// from src/visitor.ts
interface Visitor {
	filter(node: ts.Node) : boolean;
	visit(node: ts.Node, context: VisitorContext, traverse: (...visitors: Visitor[]) => void): void;
}

Consider for example the following visitor:

// from examples/poc/deletePrivate.js
{
	filter(node){
		return node.kind === ts.SyntaxKind.PropertyDeclaration
			&& node.modifiers
			&& node.modifiers.some(function(m){
				return m.kind === ts.SyntaxKind.PrivateKeyword;
			});
	},
	visit(node, context, traverse) {
		context.replace(node.getStart(), node.getEnd(), '');
		context.reportDiag(node, ts.DiagnosticCategory.Message, 'deleted field "' + node.getText()+'"', false);
	}
}

This visitor only operates on nodes representing property declarations which have the private modifier. When such a node is encountered, it is deleted from the source code, and a diagnostic message notifying the delete action is emitted.

Visitor Composition

The code transformations often happens on multiple levels of the AST. For example, one needs to traverse all class declarations, but the actual transformation is performed on the respective syntax subtree (e.g. method bodies). In order to achieve this, TSpoon lets you to execute a visitor from another visitor:

var visitor = {
    filter(node) {
        return node.kind === ts.SyntaxKind.ClassDeclaration;
    },

    visit(node, context, traverse) {
        traverse([{
            filter(node) {
                return node.kind === ts.SyntaxKind.Block;
            },

            visit(node, context, travers) {
                context.replace(node.getStart(), node.getEnd(), '');
            }
        }]);
    }
}

(This example will remove execution blocks within classes.)

Developer Documentation (with Docker - preferred)

How to build and test locally from source

Clone this project locally. Then, at the root folder of the project, run:

npm run build:docker
bin/npm install
bin/npm test

NOTE: Only the first command above uses the natively installed npm. The subsequent commands (prefixed with bin/) are scripts that transparently run npm inside the tspoon_dev container using ContainIt.

Why Docker for development?

Using Docker to perform building and testing ensures a consistent set of tools, aligned to the currently checked out version of the source repo. The primary container image for development (tspoon_dev) is defined in docker/Dockerfile.

Developer Documentation - Without Docker

how to build and test locally from source

Clone this project locally. Then, at the root folder of the project, run:

npm install
npm test

how to run local continous test feedback

At the root folder of the project, run:

npm start

Then, open your browser at http://localhost:8080/webtest.bundle and see any changes you make in tests or code reflected in the browser

Versioning

Currently Tspoon is in alpha mode. As such, it does not respect semver.

License

We use a custom license, see LICENSE.md