๐ด Starter with Webpack & Babel.js
- โ Webpack
- โ Babel (Core)
- โ
Support syntax
ES2015+
- โ
Static directory
dist/
- โ
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)
You can start in two ways:
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-babel.git
git pull boilerplate master
git remote remove boilerplate
or ...
- Download package file: https://github.com/piecioshka/boilerplate-webpack-babel/archive/master.zip
- Extract it to your project directory.
npm run build # Development mode
npm run build:development # Development mode
npm run build:production # Production mode
Open dist/
directory in browser by npm start
.
npm run dev # Use webpack-dev-server
npm run watch # Use webpack -w
Open dist/
directory in browser by npm start
.
npm run clear # Remove only dist/
npm run clear:all # Remove dist/ & node_modules/
If you would like to check how much a bundle file weight:
npm run build:development -- --env addons=bundleanalyzer
npm run build:production -- --env addons=bundleanalyzer
When would you like a modified Webpack configuration, please add a new "addon" to webpack/addons/ directory.
Each addon will be merge via webpack-merge
.
See examples:
npm run build:development -- --env addons=singleAddon
npm run build:production -- --env addons=firstAddon,secondAddon
The MIT License @ 2017-2022