blade254353074 / webpack-learning

Webpack Learning

This repo is a collection of simple demos of Webpack.

Links

• Webpack 入门
• Webpack 最简单的教程 - 阮一峰
• Webpack 中文指南
• webpack 使用教程
• Webpack 常用功能介绍
• 如何写一个webpack插件（一）
• webpack使用优化
• 基于webpack搭建前端工程解决方案探索

Documents

• Webpack CLI 文档
  • Development webpack -d === webpack --debug --devtool source-map --output-pathinfo
  • Production webpack -p === webpack --optimize-minimize --optimize-occurence-order
  • Watch mode webpack --watch
• Webpack Config 文档

How to use

First, install Webpack and webpack-dev-server globally.

$ npm i -g webpack webpack-dev-server

Then, clone the repo and install the dependencies.

$ git clone https://github.com/blade254353074/webpack-learning.git
$ cd webpack-learning
$ npm install

Now, play with the source files under the repo's demo* directories.

$ cd demo*
$ webpack-dev-server

open http://localhost:8080/webpack-dev-server/bundle in browser to watch auto update

final

$ cd final

# for production
$ webpack -d

# or for development
$ node app.js
# then open http://localhost:3000/webpack-dev-server/ in your browser

then open http://localhost:3000/