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

typepack

v0.2.1

Published

![TypePack](logo.png?raw=true "TypePack")

Downloads

177

Readme

TypePack

Create Typescript projects with minimal configuration.

Description

Typescript is a really nice language, combining the flexibility of Javascript with a great type system.

Starting a Typescript project involves choosing between only using the typescript compiler or configuring webpack (or your bundler of preference) to handle the build. Then the common files that you need to set up everytime like tsconfig.json, tslint.json, etc. And then the main types you need i.e. @types/node

Also if you maintain many projects, you would like to have everything up to date, with the same optimized configuration for everyone.

The idea of this tool is to handle all that complexity for you. It can create the initial project structure (could be web or node at the moment), starts the dev server, does the production build and run the tests.

How it works

  • The core of this cli is webpack.
  • jest is used for running the unit tests.
  • Your project source code will be transpiled first by typescript and then by babel to handle the polyfills.
  • In node mode the dev server nodemon.

Why did i do this?

I love how Typescript and the js ecosystem works, i use to start a new project once in a while and i noticed that i have different configurations everytime i start, and when i change it in some place i have to change other projects one by one, this is really annoying.

Installation

npm i -g typepack
# or
npm i --save-dev typepack
# or
yarn add -D typepack

Use

Init

tp init [name] [--mode]

tp init awesome-app # --mode web
tp init awesome-app --mode node

Dev

tp dev

Build

# Production build
tp build
# Dev build
tp build --dev
# Measure build time
tp build --smp
# Analyze bundle
tp build --analyze

Test

tp test

Configurations

All customizations could be made in the typepack.ts file. For a webapp is not needed.

For a node app

module.exports = {
  mode: "node"
};

Have a suggestion?

This project is far from being the right tool to handle all use cases.

If you have an idea, a use case to cover or a suggestion, don't hesitate in contacting me or opening an issue.