https://github.com/piecioshka/boilerplate-webpack-typescript
🍴 Starter with Webpack & TypeScript
https://github.com/piecioshka/boilerplate-webpack-typescript
boilerplate typescript webpack
Last synced: 12 days ago
JSON representation
🍴 Starter with Webpack & TypeScript
- Host: GitHub
- URL: https://github.com/piecioshka/boilerplate-webpack-typescript
- Owner: piecioshka
- Created: 2015-07-04T14:55:38.000Z (almost 11 years ago)
- Default Branch: main
- Last Pushed: 2025-03-01T12:39:37.000Z (over 1 year ago)
- Last Synced: 2026-04-23T12:34:48.549Z (2 months ago)
- Topics: boilerplate, typescript, webpack
- Language: JavaScript
- Homepage:
- Size: 429 KB
- Stars: 5
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# boilerplate-webpack-typescript
🍴 Starter with Webpack & TypeScript
## Features
- ✅ Webpack
- ✅ TypeScript
- ✅ Distribution directory `dist/`
- ✅ Directory with files as-is without changes `static/` (they will copied to `dist/static/`)
- ✅ Development with `webpack-dev-server`
- ✅ Hosting with `http-server`
- ✅ Bundle file size analytics with `webpack-bundle-analyzer`
- ✅ Two build strategies: **dev** (with source maps) & **prod** (compress file)
## Getting started
You can start in two ways:
### Use Git
```bash
mkdir PROJECT_NAME
cd $_ # Note: "$_" is the last argument of the previous command
git init # Note: branch "master" is created
git remote add boilerplate git@github.com:piecioshka/boilerplate-webpack-typescript.git
git pull boilerplate master
git remote remove boilerplate
```
or ...
### Use Zip
1. Download package file:
2. Extract it to your project directory.
## How to build an application?
```bash
npm run build # Development mode
npm run build:development # Development mode
npm run build:production # Production mode
```
_TIP: Serve `dist/` directory by `npm start`_
## How to develop an application?
```bash
npm run dev # Use webpack-dev-server
```
or
```bash
npm run watch # Use webpack -w
```
_TIP: Serve `dist/` directory by `npm start`_
## Remove generated directory
```bash
npm run clear # Remove only dist/
npm run clear:all # Remove dist/ & node_modules/
```
## 🧩 Webpack Addons
When would you like a modified Webpack configuration, please add a new "addon"
to [webpack/addons/](webpack/addons/) directory.
- [webpack.bundleAnalyzer.js](webpack/addons/webpack.bundleAnalyzer.js) - Analysis of bundle file weight
- [webpack.copyStatic.js](webpack/addons/webpack.copyStatic.js) - Copy directory `static/` to `dist/static/` _(Enabled by default)_
### How to run addons?
```bash
# Single addon
npm run dev -- --env addons=singleAddon
npm run build -- --env addons=singleAddon
npm run watch -- --env addons=singleAddon
npm run build:development -- --env addons=singleAddon
npm run build:production -- --env addons=singleAddon
## Multiple addons
npm run dev -- --env addons=firstAddon,secondAddon
```
## License
[The MIT License](https://piecioshka.mit-license.org) @ 2023