easywebpack

programming instead of configuration, webpack is no longer complex. the support feature:

• Support Webpack3 (easywebpack 3.x.x) 和 Webpack2 (easywebpack 1.x.x)

• Support server render build or client render build by easywebpack configuration.

• Support Multi-page and Single-page webpack build.

• Support auto build webpack entry by .vue and .jsx.

• Support hot-reload and javascript/css/image compress, mini, hash.

• Support dev, test, prod build mode, you can call setEnv(evn) set.

• Support call EasyWebpack.build(webpackConfig, options, callback) direct compiler file.

• Support call EasyWebpack.server(webpackConfig, options, callback) start webpack dev server.

• Support custom components such as Vue or React by extending the WebpackClientBuilder or WebpackServerBuilder extension.

Document

• 使用文档
• 技术文档
• 配置参数
• API Document
• Example

Install

$ npm i easywebpack --save-dev

Build Solution

• easywebpack-vue
• easywebpack-react
• easywebpack-weex

Webpack Command Tool

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

Project Boilerplate

• easywebpack-cli-template Config template and client render boilerplate template

• egg-vue-webpack-boilerplate support vue server side render and client render

• egg-react-webpack-boilerplate support react server side render and client render

• easywebpack-weex-boilerplate support weex native build and web build

Note: you can use easywebpack-cli init above project.

Configuration

• see config for more detail.

• more detail, please see WebpackClientBuilder and WebpackServerBuilder

Solution Implementation

extends WebpackClientBuilder (WebpackClientBuilder extends WebpackBaseBuilder) custom webpack client(browser) build config.

const EasyWebpack = require('easywebpack');
class WebpackClientBuilder extends EasyWebpack.WebpackClientBuilder {
  constructor(config) {
    super(config);
    // call below api custom client builder
  }
}
module.exports = WebpackClientBuilder;

Webpack client config: new ClientDevBuilder(config).create()

extends WebpackServerBuilder (WebpackServerBuilder extends WebpackBaseBuilder) custom webpack server(node) build config

const EasyWebpack = require('easywebpack');
class WebpackServerBuilder extends EasyWebpack.WebpackServerBuilder {
  constructor(config) {
    super(config);
    // call below api custom server builder
  }
}
module.exports = WebpackServerBuilder;

webpack server config: new WebpackServerBuilder(config).create()

webpack build

• bash command build build.js

const EasyWebpack = require('easywebpack');
const clientConfig = require('./build/client');
const serverConfig = require('./build/server');
EasyWebpack.build([clientConfig, serverConfig], {}, () => {
  console.log('wepback vue build finished');
});

• package.json:

{
  "scripts": {
      "build-dev": "NODE_ENV=development node build",
      "build-prod": "NODE_ENV=production node build"
   }
}

• bash run

npm run build-dev
npm run build-prod

Questions & Suggestions

Please open an issue here.

License

MIT