|
20 | 20 | [download-url]: https://npmjs.org/package/easywebpack |
21 | 21 |
|
22 | 22 |
|
23 | | -基于 Webpack 的前端构建工程化解决方案 [easywebpack](https://zhuanlan.zhihu.com/p/28322014) |
| 23 | + A Simple, Powerful Wepback Front-End Development Solution |
24 | 24 |
|
25 | | -## 安装 |
| 25 | +## Feature |
| 26 | + |
| 27 | + |
26 | 28 |
|
27 | | -```bash |
28 | | -npm install easywebpack-vue --save-dev |
29 | | -``` |
30 | 29 |
|
31 | | -## 文档与总结 |
| 30 | +## Document |
32 | 31 |
|
33 | 32 | - https://www.yuque.com/easy-team/easywebpack |
34 | 33 | - https://zhuanlan.zhihu.com/easywebpack |
35 | 34 |
|
36 | | -## 版本说明 |
37 | | - |
38 | | -- easywebpack 4.x.x > webpack 4.x.x |
39 | | -- easywebpack 3.x.x > webpack 3.x.x |
40 | | - |
41 | | - |
42 | | -## 基础功能 |
43 | | - |
44 | | - |
45 | | - |
46 | | -- 支持服务端渲染, 前端渲染, 静态页面渲染三种构建方式 |
47 | | -- 支持单页面, 多页面服务端渲染构建模式 |
48 | | -- 默认支持 `dev`,`test`, `prod` 环境配置 |
49 | | -- 集成 `webpack-hot-middleware` 热更新实现, 支持 css inline 和 css extract 热更新 |
50 | | -- 支持 entry 原生配置和目录遍历自动构造 entry 功能 |
51 | | -- 支持自动根据后缀名构建 entry 文件，比如 `.vue` 和 `.jsx` 文件为入口文件 |
52 | | -- 支持 es6 class 继承方式编写 Webpack 配置 |
53 | | -- 支持 js/css/image 压缩, 内置支持 CDN 特性 |
54 | | -- 支持 css/sass/less/stylus， 支持css module 和 css extract 特性 |
55 | | -- 支持 loader 是否启用，合并，覆盖配置 |
56 | | -- 支持 plugin 是否启用，合并，覆盖配置 |
57 | | -- 支持 loader 和 plugin npm module 是否启用，按需安装 |
58 | | -- 支持 eslint, postcss 等特性 |
59 | | -- 支持 dll 构建解决方案 |
60 | | -- 支持 webpack typescript 构建 |
61 | | -- 提供 `easywebpack-cli` 和 `webpack-tool` 辅助工具。 |
62 | | - |
63 | | -**easywebpack不与任何框架耦合， 你需要基于现有的解决方案使用或者扩展解决方案使用** |
64 | 35 |
|
| 36 | +## Install |
65 | 37 |
|
66 | | -## 工程化 |
| 38 | +```bash |
| 39 | +$ npm i easywebpack --save-dev |
| 40 | +``` |
67 | 41 |
|
68 | | - |
| 42 | +## Usage |
| 43 | + |
| 44 | +```js |
| 45 | +const easywebpack = requier('easywebpack'); |
| 46 | +const env = process.env.BUILD_ENV; // support dev/test/prod |
| 47 | +const webpackConfig = easywebpack.getWebpackConfig({ |
| 48 | + env, |
| 49 | + target: 'web', |
| 50 | + entry: { |
| 51 | + index: 'src/app.js' |
| 52 | + } |
| 53 | +}); |
| 54 | +``` |
69 | 55 |
|
70 | | -### 解决方案 |
| 56 | +## Usage Solution |
71 | 57 |
|
72 | | -基于 `easywebpack` 基础骨架，目前已扩展 `Vue` `React` `Weex`, `HTML`, `Javascript` 五种解决方案： |
73 | | -- [easywebpack-js](https://github.com/easy-team/easywebpack-js.git) 支持纯 javascript 文件构建模式 |
74 | | -- [easywebpack-vue](https://github.com/easy-team/easywebpack-vue.git) 支持 Vue 纯前端构建和Node端构建模式 |
75 | | -- [easywebpack-react](https://github.com/easy-team/easywebpack-react.git) 支持 React 纯前端构建和Node端构建模式 |
76 | | -- [easywebpack-weex](https://github.com/easy-team/easywebpack-weex.git) 支持 Native 和 Web 构建模式 |
77 | | -- [easywebpack-html](https://github.com/easy-team/easywebpack-html.git) 支持 HTML静态页面模式，支持 nunjucks 引擎 |
| 58 | +- [easywebpack-js](https://github.com/easy-team/easywebpack-js.git) |
| 59 | +- [easywebpack-vue](https://github.com/easy-team/easywebpack-vue.git) |
| 60 | +- [easywebpack-react](https://github.com/easy-team/easywebpack-react.git) |
| 61 | +- [easywebpack-weex](https://github.com/easy-team/easywebpack-weex.git) |
| 62 | +- [easywebpack-html](https://github.com/easy-team/easywebpack-html.git) |
78 | 63 |
|
| 64 | +## Webpack Command Tool |
79 | 65 |
|
80 | | -### 命令行工具 |
| 66 | +[easywebpack-cli](https://github.com/easy-team/easywebpack-cli.git) Webpack Building Command Line And Boilerplate Init Tool for easywebpack |
81 | 67 |
|
82 | | -[easywebpack-cli](https://github.com/easy-team/easywebpack-cli.git) 基于 easywebpack 前端工程化解决方案构建的脚手架命令行工具。 |
| 68 | +## Application Boilerplate |
83 | 69 |
|
84 | | -- 支持 Vue/React/Weex/HTML 框架项目的初始化，包括 SPA 应用，多页面应用，Server Side Render(Egg)项目 |
85 | | -- 支持命令行 Webpack 构建，包括 Webpack 配置信息打印(调试)和获取 |
86 | | -- 提供构建结果 UI 导航展现和访问。 |
| 70 | +- [vue-webpack-boilerplate](https://github.com/hubcarl/easywebpack-cli-template/boilerplate/vue) Vue Front-End Application |
87 | 71 |
|
| 72 | +- [react-webpack-boilerplate](https://github.com/hubcarl/easywebpack-cli-template/boilerplate/vue) React Front-End Application |
88 | 73 |
|
89 | | -### 项目骨架 |
| 74 | +- [weex-webpack-boilerplate](https://github.com/easy-team/easywebpack-weex-boilerplate) Weex Front-End Application |
90 | 75 |
|
91 | | -- [easywebpack-cli-template](https://github.com/easy-team/easywebpack-cli-template) Vue/React/Weex 纯前端项目目标 |
| 76 | +- [egg-vue-webpack-boilerplate](https://github.com/easy-team/egg-vue-webpack-boilerplate) Egg + Vue Server Side Render Application |
92 | 77 |
|
93 | | -- [egg-vue-webpack-boilerplate](https://github.com/easy-team/egg-vue-webpack-boilerplate) Egg + Vue 服务端渲染骨架 |
| 78 | +- [egg-vue-webpack-spa-boilerplate](https://github.com/easy-team/egg-vue-webpack-boilerplate/tree/feature/green/spa) Egg + Vue Server Side Render Single Page Application |
94 | 79 |
|
95 | | -- [egg-vue-webpack-spa-boilerplate](https://github.com/easy-team/egg-vue-webpack-boilerplate/tree/feature/green/spa) Egg + Vue 单页面服务端渲染骨架 |
| 80 | +- [egg-vue-webpack-mpa-boilerplate](https://github.com/easy-team/egg-vue-webpack-boilerplate/tree/feature/green/multi) Egg + Vue Server Side Render Multil Page Application |
96 | 81 |
|
97 | | -- [egg-vue-webpack-mpa-boilerplate](https://github.com/easy-team/egg-vue-webpack-boilerplate/tree/feature/green/multi) Egg + Vue 多页面服务端渲染骨架 |
| 82 | +- [egg-vue-typescript-boilerplate](https://github.com/easy-team/egg-vue-typescript-boilerplate) Egg + Vue + TypeScript + Webpack Server Side Render Application |
98 | 83 |
|
99 | | -- [egg-vue-typescript-boilerplate](https://github.com/easy-team/egg-vue-typescript-boilerplate) Egg + Vue + TypeScript + Webpack 服务端渲染骨架 |
| 84 | +- [egg-react-webpack-boilerplate](https://github.com/easy-team/egg-react-webpack-boilerplate) Egg + React Server Side Render Application |
100 | 85 |
|
101 | | -- [egg-react-webpack-boilerplate](https://github.com/easy-team/egg-react-webpack-boilerplate) Egg + React 服务端渲染骨架 |
| 86 | +- [egg-react-webpack-spa-boilerplate](https://github.com/easy-team/egg-react-webpack-boilerplate/tree/feature/green/spa) Egg + React Server Side Render Single Page Application |
102 | 87 |
|
103 | | -- [egg-react-webpack-spa-boilerplate](https://github.com/easy-team/egg-react-webpack-boilerplate/tree/feature/green/spa) Egg + React 单页面服务端渲染骨架 |
| 88 | +- [egg-react-webpack-mpa-boilerplate](https://github.com/easy-team/egg-react-webpack-boilerplate/tree/feature/green/multi) Egg + React Server Side Render Multil Page Application |
104 | 89 |
|
105 | | -- [egg-react-webpack-mpa-boilerplate](https://github.com/easy-team/egg-react-webpack-boilerplate/tree/feature/green/multi) Egg + React 多页面服务端渲染骨架 |
| 90 | +- [egg-react-typescript-boilerplate](https://github.com/easy-team/egg-react-typescript-boilerplate) Egg + React + TypeScript + Webpack Server Side Render Application |
106 | 91 |
|
107 | | -- [egg-react-typescript-boilerplate](https://github.com/easy-team/egg-react-typescript-boilerplate) Egg + React + TypeScript + Webpack 服务端渲染骨架 |
| 92 | +- [html-webpack-boilerplate](https://github.com/easy-team/easywebpack-multiple-html-boilerplate) HTML Front-End Application |
108 | 93 |
|
109 | | -- [easywebpack-weex-boilerplate](https://github.com/easy-team/easywebpack-weex-boilerplate) Weex Native 和 Web 构建骨架项目 |
110 | 94 |
|
111 | | -- [easywebpack-multiple-html-boilerplate](https://github.com/easy-team/easywebpack-multiple-html-boilerplate) 静态页面构建方案骨架，支持纯 HTML 构建 和 nunjucks 构建。 |
| 95 | +## Questions & Suggestions |
112 | 96 |
|
113 | | -**以上骨架可以通过 easywebpack-cli 初始化** |
| 97 | +Please open an issue [here](https://github.com/easy-team/easywebpack/issues). |
114 | 98 |
|
115 | 99 | ## License |
116 | 100 |
|
|
0 commit comments