easywebpack

A Simple, Powerful Wepback Front-End Development Solution

Feature

• ✔︎ Provide Webapck Development and Build Capabilities, Such As Normal Webpack Plugin And Loaders
• ✔︎ Provide Base Capabilities Support, Such As PostCss, Sass, Less, Stylus, Css Module, Service Worker
• ✔︎ Provide Webpack Basic Development And Build Capabilities, Such As Dev server, Hot-Reload, TypeScript, Dll
• ✔︎ Provide Webpack Efficient Development Tool, Such As Bundle Size Analysis, Bundle Build Cost Analysis, Mock Server, HTTP Web Server And So On.
• ✔︎ Provide Multiple Types Of Project Building, Such As React, Vue, Weex, HTML, Weex Application
• ✔︎ Provide Webpack Web (Browser Client Side Render) And Node (Node Server Side Render) Buiding Mode
• ✔︎ Provide Strong Extend Capabilities For More Front-End Framework

Document

• https://easyjs.cn
• https://www.yuque.com/easy-team/easywebpack
• https://zhuanlan.zhihu.com/easywebpack

Install

$ npm i @easy-team/easywebpack --save-dev

Usage

• Webpack Config

// ${root}/webpack.config.js
const easywebpack = requier('@easy-team/easywebpack');
const env = process.env.BUILD_ENV; // support dev/test/prod
const webpackConfig = easywebpack.getWebpackConfig({
  env,
  target: 'web',
  entry: {
    index: 'src/app.js'
  }
});
module.exports = webpackConfig;

Front-End Framework

• easywebpack-vue
• easywebpack-react
• easywebpack-weex
• easywebpack-html
• easywebpack-js

Webpack Command Tool

npm install easy-team/easywebpack-cli -g

QuickStart Programming

easywebpack-cli Webpack Building Command Line And Boilerplate Init Tool for easywebpack

Efficient Development

• Use the plugin webpack-bundle-analyzer or stats-webpack-plugin for webpack build size analysis

  easy build --size
  

  

• Use the plugin speed-measure-webpack-plugin for webpack build speed analysis and count the time spent on each loader and plugin

  easy build --speed
  

• support start local file web http server and data mock service by node-http-server

  easy server -d mock
  

Application Boilerplate

Vue/React Client Side Render Application

• Vue-Webpack-Boilerplate Vue Front-End Application

• React-Wbpack-Boilerplate React Front-End Application

Egg + Vue Server/Client Side Render Webpack Building Application

• Egg + Vue Server Side Render Application

• Egg + Vue + Vuex + Vue-Router Server Side Render Application

• Egg + Vue + Vuex + Vue-Router Client Side Render Application

• Egg + Vue + Nunjucks HTML Static Render Application

• Egg + Element Admin Application

• Egg + Vue + Typescript Web Application 和 ves-admin

Egg + React Server/Client Side Render Webpack Building Application

• Egg + React Server Side Render Application

• Egg + React + Nunjucks HTML Static Render Application

• Egg + React + Nunjucks HTML Dynamic Render Application

• Egg + React + React Router + Redux Single Page Application

• Egg + AntD + React Router + Redux + React-Redux

• Egg + React + Typescript Web Application

Weex/HTML Webpack Building Application

• Weex-Webpack-Example Weex Front-End Application
• Html-Webpack-Example HTML Front-End Application

Questions & Suggestions

Please open an issue here.

Contributors

sky 💻 📖	jasonjcpeng 💻 📖	Kevin Zhong 💻 📖	HiuYanChong 💻 📖	Suyi 💻 📖	Roy Li 💻 📖	Mice 💻 📖
小杰 💻 📖	asins 💻 📖

License

MIT