2020[ download-image ] : https://img.shields.io/npm/dm/easywebpack-react.svg?style=flat-square
2121[ download-url ] : https://npmjs.org/package/easywebpack-react
2222
23- Webpack client render and server side render build solution for React
23+ React client render and server side render build solution for Webpack
2424
2525- easywebpack-react ^4.x.x > webpack 4.x.x
2626- easywebpack-react ^3.x.x > webpack 3.x.x
2727
28-
2928## Featues
3029
31- ![ easywebpack] ( https://github.com/easy-team/easywebpack/blob/master/docs/images/easywebpack.png )
32-
33- see [ easywebpack] ( https://github.com/easy-team/easywebpack )
30+ - ✔︎ React Client Render and Server Side Render Build Mode
31+ - ✔︎ React Single Appliaction and React Mutil Appliaction Build Mode
32+ - ✔︎ Hot Reload, Css Hot Reload, Code Splitting, High Speed, Cache Build, Thread Build
33+ - ✔︎ ES5/ES6/ES7, TypeScript, DLL, Css Module, Dynamic Import, AntD Dynamic Import
34+ - ✔︎ Powerful Tool Chain [ easywebpack-cli] ( https://github.com/easy-team/easywebpack-cli )
3435
3536## Documents
3637
@@ -43,52 +44,74 @@ see [easywebpack](https://github.com/easy-team/easywebpack)
4344$ npm i easywebpack-react --save-dev
4445```
4546
46- ## Usage
47+ ## QuickStart
48+
49+ - Install Command Line
50+
51+ ``` bash
52+ $ npm i easywebpack-cli -g
53+ ```
54+
55+ - Initalize Application
56+
57+ ``` bash
58+ $ easy init
59+ ```
60+
61+ - Running Application
62+
63+ ``` bash
64+ $ npm start
65+ ```
4766
67+ ## Configuration
4868
49- ### ` webpack.config.js `
69+ ### Write Webpack Config ` webpack.config.js `
5070
5171``` js
5272const easywebpack = require (' easywebpack-react' );
5373const webpack = easywebpack .webpack ;
5474const merge = easywebpack .merge ;
55- const baseWebpackConfig = easywebpack .getWebpackConfig ({
75+ const webpackConfig = easywebpack .getWebpackConfig ({
5676 env, // support dev, test, prod
5777 target : ' web' , // browser mode build
5878 entry: {
59- app: ' src/index.js'
79+ app: ' src/index.js'
80+ },
81+ customize (webpackConfig ) {
82+ // ... customize webpack config
83+ return webpackConfig;
6084 }
6185});
62- module .exports = merge (baseWebpackConfig, {
63-
64- })
6586```
6687
67- ### use ` webpack ` command build
88+ ### Webpack Build
89+
90+ ``` bash
91+ easy build --webpack
92+ ```
93+
94+ OR
6895
6996``` bash
7097webpack --config webpack.config.js
7198```
7299
73- ### base ` easywebpacack-cli ` build mode
100+
101+ ### Application Development & Building
74102
75103``` js
76104const webpackConfig = require (' ./webpack.config.js' );
77-
78- if (process .env .NODE_SERVER ) {
79- // development mode: webpack building and start webpack hot server
80- ReactWebpack .server (config);
81- } else {
82- // build file to disk
83- ReactWebpack .build (config);
84- }
85- ```
105+ const easywebpack = require (' easywebpack-react' );
106+ const webpackTool = new WebpackTool ();
107+ // development mode
108+ easywebpack .server (webpackConfig);
109+ // build file to disk
110+ easywebpack .build (webpackConfig);
86111
87112
88113## Example
89114
90- - see [ test/web] ( test/web ) for more detail.
91-
92115- [react- client- render- boilerplate](https: // github.com/easy-team/easywebpack-cli-template/tree/master/boilerplate/react) React client render boilerplate.
93116
94117- [egg- react- webpack- boilerplate](https: // github.com/easy-team/egg-react-webpack-boilerplate) support client render and server render.
@@ -97,6 +120,7 @@ if (process.env.NODE_SERVER) {
97120
98121- you can use [easywebpack- cli](https: // github.com/easy-team/easywebpack-cli) create client render project or create server side render project for react.
99122
123+
100124## Questions & Suggestions
101125
102126Please open an issue [here](https: // github.com/easy-team/easywebpack-react).
0 commit comments