Repository files navigation

Run one simple command to install and use the interactive project generator. You'll needNodev10 or later.

npx typescript-starter

The interactive CLI will help you create and configure your project automatically.

Since this repo includesthe CLI and it's tests, you'll only need to fork or clone this project if you want to contribute. If you find this project useful, please considerleaving a star so others can find it. Thanks!

• Writestandard, future javascript – with stable ESNext features – today (stage 3 orfinished features)
• Optionally use typescript to improve tooling, linting, and documentation generation
• Export as ajavascript module, making your workfully tree-shakable for consumers capable of usinges6 imports (likeRollup,Webpack, orParcel)
• Export type declarations to improve your downstream development experience
• Backwards compatibility for Node.js-style (CommonJS) imports
• Both strict and flexibletypescript configurations available

So we can have nice things:

• Generate API documentation (HTML or JSON)without a mess of JSDoc tags to maintain
• Collocated, atomic, concurrent unit tests withAVA
• Source-mapped code coverage reports withnyc
• Configurable code coverage testing (for continuous integration)
• Automatic linting and formatting usingtypescript-eslint andPrettier

Before you start, consider using aneditor with good typescript support.

VS Code (below) is a popular option. Editors with typescript support can provide helpful autocomplete, inline documentation, and code refactoring features.

Also consider installing editor extensions forESLint andPrettier. These extensions automatically format your code each time you save, and may quickly become invaluable.

To start working, run thewatch:build task usingnpm oryarn.

npm run watch:build

In another terminal tab/window, run thewatch:test task:

npm run watch:test

These watch tasks make development much faster and more interactive. They're particularly helpful forTDD/BDD workflows.

These watch tasks will build and watch the entire project for changes (to both the library source files and test source files). As you develop, you can add tests for new functionality – which will initially fail – before developing the new functionality. Each time you save, any changes will be rebuilt and retested.

Since only changed files are rebuilt and retested, this workflow remains fast even for large projects.

To make getting started easier, the defaulttsconfig.json is using a very flexible configuration. This will allow you to get started without many warnings from Typescript.

To enable additional Typescript type checking features (a good idea for mission-critical or large projects), review the commented-out lines in yourtypescript compiler options.

To automatically fixeslint andprettier formatting issues, run:

npm run fix

To generate and view test coverage, run:

npm run cov

This will create an HTML report of test coverage – source-mapped back to Typescript – and open it in your default browser.

The src folder is analyzed and documentation is automatically generated usingTypeDoc.

npm run doc

This command generates API documentation for your library in HTML format and opens it in a browser.

Since types are tracked by Typescript, there's no need to indicate types in JSDoc format. For more information, see theTypeDoc documentation.

To generate and publish your documentation toGitHub Pages use the following command:

npm run doc:publish

Once published, your documentation should be available at the proper GitHub Pages URL for your repo. Seetypescript-starter's GitHub Pages for an example.

For more advanced documentation generation, you can provide your ownTypeDoc theme, orbuild your own documentation using the JSON TypeDoc export:

npm run doc:json

It's recommended that you installcommitizen to make commits to your project.

npm install -g commitizen# commit your changes:git cz

This project is tooled forconventional changelog to make managing releases easier. See thestandard-version documentation for more information on the workflow, orCHANGELOG.md for an example.

# bump package.json version, update CHANGELOG.md, git tag the releasenpm run version

You may find a tool likewip helpful for managing work in progress before you're ready to create a meaningful commit.

Bringing together many of the steps above, this repo includes a one-step release preparation command.

# Prepare a standard release:npm run prepare-release

This command runs the following tasks:

• hard-reset: cleans the repo by removing all untracked files and resetting--hard to the latest commit. (Note: this could be destructive.)
• test: build and fully test the project
• docs:html: generate the latest version of the documentation
• docs:publish: publish the documentation to GitHub Pages
• version: bump package.json version, update CHANGELOG.md, and git tag the release

When the script finishes, it will log the final command needed to push the release commit to the repo and publish the package on thenpm registry:

git push --follow-tags origin master; npm publish

Look over the release if you'd like, then execute the command to publish everything.

You can also prepare a non-standard release:

# Or a non-standard release:# Reset the repo to the latest commit and build everythingnpm run hard-reset&& npm runtest&& npm run cov:check&& npm run doc:html# Then version it with standard-version options. e.g.:# don't bump package.json versionnpm run version -- --first-release# Other popular options include:# PGP sign it:# $ npm run version -- --sign# alpha release:# $ npm run version -- --prerelease alpha# And don't forget to push the docs to GitHub pages:npm run doc:publish

Thesrc oftypescript-starter is compiled into two separate builds:main andmodule. Themain build isconfigured to use the CommonJS module system. Themodule builduses the new es6 module system.

Because Node.js LTS releases do not yet support the es6 module system, some projects which depend on your project will follow themain field inpackage.json. Tools which support the new system (likeRollup,Webpack, orParcel) will follow themodule field, giving them the ability to statically analyze your project. These tools can tree-shake yourmodule build to import only the code they need.

By convention, sample tests in this project are adjacent to the files they test.

• Such tests are easy to find.
• You see at a glance if a part of your project lacks tests.
• Nearby tests can reveal how a part works in context.
• When you move the source (inevitable), you remember to move the test.
• When you rename the source file (inevitable), you remember to rename the test file.

(Bullet points taken fromthe Angular Testing Guide.)

Yes. For some projects, separating tests from the code they test may be desirable. This project is already configured to test any*.spec.ts files located in thesrc directory, so reorganize your tests however you'd like. You can put them all in a single folder, add tests that test more than one file, or mix and match strategies (e.g. for other types of tests, like integration or e2e tests).

Tests are compiled and performed on the final builds in the standard Node.js runtime (rather than an alternative likets-node) to ensure that they pass in that environment. If you are build a Node.js application, and you are usingts-node in production, you can modify this project to usets-node rather than abuild step.

However, if you're building any kind of library, you should always compile to javascript.

Library authors sometimes make the mistake of distributing their libraries in typescript. Intuitively, this seems like a reasonable course of action, especially if all of your intended consumers will be using typescript as well.

TypeScript has versions, and different versions of TypeScript may not be compatible. Upgrading to a new major version of TypeScript sometimes requires code changes, and must be done project-by-project. Additionally, if you're using the latest version of TypeScript to build your library, and one of your consumers is using an older version in their application, their compiler will be unable to compile your library.

The short answer is:don't pre-bundle your library.

Previous versions oftypescript-starter included browser bundling usingRollup. This feature has since been removed, since very few libraries should ever be pre-bundled.

If the consumer of your library is using Node.js, bundling is especially unnecessary, since Node.js can reliably resolve dependencies, and bundling may even make debugging more difficult.

If the consumer of your library is a browser application,the application likely has its own build tooling. Very few serious applications are manually bundling their javascript, especially with easy to use, no configuration tools likeParcel available.

Your library is most useful to downstream consumers as a clean, modular codebase, properly exporting features using es6 exports. Consumers can import the exact es6 exports they need from your library, and tree-shake the rest.

In the past, complex javascript libraries have used solutions likeBrowserify to bundle a version of their application for the browser. Most of these solutions work by allowing library developers to extensively configure and manually override various dependencies with respective browser versions.

For example, where a Node.js application might use Node.js' built-incrypto module, a browser version would need to fall back to a polyfill-like alternative dependency likecrypto-browserify.

With es6, this customization and configuration is no longer necessary. Your library can now export different functionality for different consumers. While browser consumers may import a native JavaScript crypto implementation which your library exports, Node.js users can choose to import a different, faster implementation which your library exports.

Seehash.ts for a complete example. Two different functions are exported,sha256, andsha256Native. Browser consumers will not be able to importsha256Native, since their bundler will be unable to resolve the built-in Node.js dependency (their bundler will throw an error). Node.js users, however, will be able to import it normally. Each consumer can import the exact functionality they need.

One perceived downside of this solution is that it complicates the library's API. Browser consumers will sometimes import one feature while Node.js users import another. While this argument has merit, we should weigh it against the benefits.

Providing a public API where consumer code is the same between browsers and Node.js is desirable, but it comes at the cost of significant configuration and complexity. In many cases, it requires that code be aware of its environment at runtime, requiring additional complexity and testing.

A better way to provide this developer experience is to provide similar APIs for each environment, and then encourage the use of es6 import aliasing to standardize between them.

For example, in the documentation fortypescript-starter, we encourage Node.js users to importsha256Native as sha256. With this convention, we get a standard API without loaders or dependency substitution hacks.

// browser-application.jsimport{sha256}from'typescript-starter';// fully-portable codeconsole.log(sha256('test'));

// node-application.jsimport{sha256Nativeassha256}from'typescript-starter';// fully-portable codeconsole.log(sha256('test'));

This project usesstandard-version to automatically update the changelog based on commit messages since the last release. To do this, each relevant commit must be properly formatted.

To ensure all commits follow the proper conventions, you can use a package likecommitlint withHusky. However, keep in mind that commit hooks can be confusing, especially for new contributors. They also interfere with some development tools and workflows.

If your project is private, or will primarily receive contributions from long-running contributors, this may be a good fit. Otherwise, this setup may raise the barrier to one-off contributions slightly.

Note, as a maintainer, if you manage your project on GitHub or a similar website, you can now use theSquash and Merge option to add a properly formatted, descriptive commit messages when merging each pull request. This is likely to be more valuable than trying to force one-time contributors to adhere to commit conventions, since you can also maintain a more consistent language style. Because this is the best choice for the vast majority of projects,typescript-starter does not bundle any commit message validation.

git clone https://github.com/bitjson/typescript-starter.gitcd typescript-starternpm installnpm testnpm link

mkdir typescript-starter-testingcd typescript-starter-testingTYPESCRIPT_STARTER_REPO_URL='/local/path/to/typescript-starter' typescript-starter

TYPESCRIPT_STARTER_REPO_URL='https://github.com/YOUR_USERNAME/typescript-starter.git' typescript-starter

npm run check-cli

git stash&& npm run check-cli&& git stash pop&& npm run check-cli