LoginSignup
1
0

More than 5 years have passed since last update.

create-ts-lib: TypeScript WebPack Starter CLI

Last updated at Posted at 2017-12-20

create-ts-lib

๐Ÿ  Home Page - โšก Github Page - ๐Ÿ“ฆ NPM Package
Build Status Npm Package

A yet another Typescript Webpack Starter

Imgur

Built upon

Quick Overview

npm install -g create-ts-lib

create-ts-lib my-typescript-lib
cd my-typescript-lib/
npm start

Then open http://localhost:3000/ to see your bootstrapped module.
When youโ€™re ready to deploy to production, create a minified bundle with npm run build.

Get Started Immediately

You donโ€™t need to install or configure tools like Webpack or Babel.

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

Just create a project, and youโ€™re good to go.

Getting started

Installation

Install it once globally:

npm install -g create-ts-lib

Creating a TypeScript module

To create a new module, run:

create-ts-lib my-ts-module
cd my-ts-module

It will create a directory called my-ts-module inside the current folder.

Inside that directory, it will generate the initial project structure and install the transitive dependencies:

my-ts-module
โ”œโ”€โ”€ node_modules
โ”œโ”€โ”€ src
โ”‚   โ””โ”€โ”€ index.html
โ”‚   โ””โ”€โ”€ index.spec.ts
โ”‚   โ””โ”€โ”€ index.ts
โ”‚   โ””โ”€โ”€ vendor.js
โ”œโ”€โ”€ tests
โ”‚    โ””โ”€โ”€ unit
โ”‚        โ””โ”€โ”€ spec-bundle.js
โ”œโ”€โ”€ README.md
โ”œโ”€โ”€ package.json
โ”œโ”€โ”€ .gitignore
โ”œโ”€โ”€ karma.conf.js
โ”œโ”€โ”€ tsconfig.json
โ”œโ”€โ”€ tslint.json
โ”œโ”€โ”€ typings.json
โ””โ”€โ”€ webpack.config.js

No configuration or complicated folder structures, just the files you need to build your app.

Once the installation is done, you can run some commands inside the project folder:

npm start or npm run server:prod

Runs the app in development / production mode using Webpack dev server.
Open 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

Build a development release

After build phase, 3 files are generated into the dist folder:
- app.bundle.js - contains the core of the application. From the entry point src/index.ts
- vendor.bundle.js - contains the vendor dependencies. From the entry point src/vendor.ts (lodash is added as an example)
- index.html - html page referencing these files

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0