Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/nobrainr/typescript-webpack-starter

⚡ create-ts-lib: A Starter Kit and a CLI to create your TypeScript / ES6 module bundled by Webpack without thinking about build or unit tests configurations. 🏠
https://github.com/nobrainr/typescript-webpack-starter

es2015 es6 jasmine javascript karma karma-jasmine nodejs npm npm-package starter typescript unit-test webpack webpack-server

Last synced: 27 days ago
JSON representation

⚡ create-ts-lib: A Starter Kit and a CLI to create your TypeScript / ES6 module bundled by Webpack without thinking about build or unit tests configurations. 🏠

Host: GitHub
URL: https://github.com/nobrainr/typescript-webpack-starter
Owner: nobrainr
License: mit
Created: 2016-08-08T01:14:39.000Z (over 8 years ago)
Default Branch: master
Last Pushed: 2023-01-04T13:46:05.000Z (almost 2 years ago)
Last Synced: 2024-04-14T15:40:17.089Z (7 months ago)
Topics: es2015, es6, jasmine, javascript, karma, karma-jasmine, nodejs, npm, npm-package, starter, typescript, unit-test, webpack, webpack-server
Language: JavaScript
Homepage: https://nobrainr.github.io/typescript-webpack-starter/
Size: 1.35 MB
Stars: 374
Watchers: 9
Forks: 43
Open Issues: 60
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE

Awesome Lists containing this project

README

# create-ts-lib [![Backers on Open Collective](https://opencollective.com/typescript-webpack-starter/backers/badge.svg)](#backers) [![Sponsors on Open Collective](https://opencollective.com/typescript-webpack-starter/sponsors/badge.svg)](#sponsors) [![CircleCI](https://img.shields.io/circleci/project/github/nobrainr/typescript-webpack-starter.svg)](https://circleci.com/gh/nobrainr/workflows/typescript-webpack-starter/tree/master) [![Npm Package](https://img.shields.io/npm/v/create-ts-lib.svg)](https://www.npmjs.com/package/create-ts-lib)

![](https://s3.us-east-2.amazonaws.com/typescript-webpack-starter/create-ts-lib.gif)

## Quick Start

You can execute the `create-ts-lib` CLI using [`npx`](https://github.com/zkat/npx) or by installing it globally with `npm i -g create-ts-lib`.

```sh
# Use NPX or npm install -g create-ts-lib to install it as a global package
npx create-ts-lib@latest my-typescript-lib
cd my-typescript-lib && npm start
```

### Build and Serve it

- Browse http://localhost:3000/ to see your bootstrapped module.
- A bundle is created under `/dist` folder.
- Create a minified bundle with `npm run build`.

## Features

You **don’t** need to install or configure tools like `Webpack`, `Typescript`, `Karma` or `Jasmine`.

They are preconfigured so that you can focus on the code, but as a starter kit you still can modify all the configuration files.

- [x] (Application Type) [Typescript 3](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-0.html)
- [x] (Bundler) [Webpack 4](https://webpack.js.org/)
- [x] [Karma](https://karma-runner.github.io/1.0/index.html), [Jasmine](https://jasmine.github.io/)

### Create a Typescript project

```sh
# Use NPX or npm install -g create-ts-lib to install it as a global package
npx create-ts-lib@latest my-typescript-lib
cd my-typescript-lib && npm start
```

Calling `create-ts-lib` with `my-typescript-lib` as an argument creates a directory `my-typescript-lib` inside the current directory.

Inside that directory, the initial file structure of the project is generated with all the devDependencies installed.

```sh
my-typescript-lib
├── node_modules
├── src
│ └── index.html
│ └── index.ts
│ └── MyLibrary.ts
│ └── MyLibrary.spec.ts
├── tests
│ └── unit
│ └── spec-bundle.js
├── README.md
├── package.json
├── .gitignore
├── karma.conf.js
├── tsconfig.json
├── tslint.json
└── webpack.config.js
```

No configuration or complicated folder structures, just the files you need to start your app / package / module.

### `npm start` or `npm run server:prod`

Runs the app in development / production mode using Webpack dev server.
Open [http://localhost:3000](http://localhost:3000) 🎉 to view it in the browser.

### `npm test`

Runs the unit tests using Karma as test runner and Jasmine as testing framework.

### `npm run build` or `npm run build:prod`

Creates a bundle into the `dist` folder:

```sh
dist
├── MyLibrary.d.ts # - Example of a 'd.ts' declaration file
├── app.bundle.js # - Main bundle of the application. name from webpack.config
├── app.bundle.js.map # - Sourcemap
├── index.d.ts
└── index.html # - html page referencing app.bundle.js
```

## Development

We'd love to have your helping hand on `create-ts-lib`! See [CONTRIBUTING.md](CONTRIBUTING.md) for more information on what we're looking for and how to get started.

## Contributors

This project exists thanks to all the people who contribute. [[Contribute](CONTRIBUTING.md)].

## Backers

Thank you to all our backers! 🙏 [[Become a backer](https://opencollective.com/typescript-webpack-starter#backer)]

## Sponsors

Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [[Become a sponsor](https://opencollective.com/typescript-webpack-starter#sponsor)]