https://github.com/suwigyarathore/webpack-production
This repo contains how to use webpack to make production ready build
https://github.com/suwigyarathore/webpack-production
code-splitting deadcodeelimination hot-reload productionready treeshaking webpack
Last synced: 11 days ago
JSON representation
This repo contains how to use webpack to make production ready build
- Host: GitHub
- URL: https://github.com/suwigyarathore/webpack-production
- Owner: suwigyarathore
- Created: 2017-05-14T23:50:27.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2017-07-16T13:50:02.000Z (almost 9 years ago)
- Last Synced: 2025-01-21T10:31:00.516Z (over 1 year ago)
- Topics: code-splitting, deadcodeelimination, hot-reload, productionready, treeshaking, webpack
- Language: JavaScript
- Size: 791 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
#webpack-tutorial
This repo contains how to use webpack to make production ready build
Topics Covered:
* What is Webpack
* How to create a production ready bundle
* How to do code splitting
* How to do dead code elimination
* How to do tree shaking to remove dead code
* How to do hot module replacement (HMR)
* How to do hot/live reload
* How to use ES6/ES.next/ES2015 code in production with Babel
* How to load images
* How to load style (css)
* ...and more
### Installation
#### 1. Install
```
# Clone this repo
git clone https://github.com/suwigyarathore/webpack-production.git
# Install dependencies
npm install
# Run for development
npm run dev
# go to http://localhost:8080
# Run for production
npm run build
```
### Links
State of Javascript
* [http://stateofjs.com](http://stateofjs.com)
Webpack
* [http://webpack.github.io](http://webpack.github.io)
* [http://webpack.github.io/docs/list-of-plugins.html](http://webpack.github.io/docs/list-of-plugins.html)
* [http://webpack.github.io/docs/list-of-loaders.html](http://webpack.github.io/docs/list-of-loaders.html)
Webpack Dev Server
* [https://webpack.github.io/docs/webpack-dev-server.html](https://webpack.github.io/docs/webpack-dev-server.html)
Plugins
* Extract Text
* [https://github.com/webpack/extract-text-webpack-plugin](https://github.com/webpack/extract-text-webpack-plugin)
* HTML Webpack
* [https://github.com/ampedandwired/html-webpack-plugin](https://github.com/ampedandwired/html-webpack-plugin)
* UglifyJS
* [https://webpack.github.io/docs/list-of-plugins.html](https://webpack.github.io/docs/list-of-plugins.html)
* [https://github.com/mishoo/UglifyJS](https://github.com/mishoo/UglifyJS)
* Define
* [https://webpack.github.io/docs/list-of-plugins.html](https://webpack.github.io/docs/list-of-plugins.html)
Loaders
* babel-loader
* [https://github.com/babel/babel-loader](https://github.com/babel/babel-loader)
* url-loader
* [https://github.com/webpack/url-loader](https://github.com/webpack/url-loader)
* file-loader
* [https://github.com/webpack/file-loader](https://github.com/webpack/file-loader)
* style-loader
* [https://github.com/webpack/style-loader](https://github.com/webpack/style-loader)
* css-loader
* [https://github.com/webpack/css-loader](https://github.com/webpack/css-loader)