Chain building your complex webpackConfig.
Ezreal combines some middleware with a preset to build your webpackConfig. Why not use neutrinoJs ？For more details, you can read this pr.
So ezreal can do even better in the following areas
- Single responsibility principle: a middleware does only one thing
- Preset support: the preset concept makes it easy to publish to npm to share your configuration
- Pipeline build: instead of nested call, flat call middleware one by one
- No side effects: the code implementation makes it more side-effect-free and pure
yarn add ezreal-core
const bootstrap = require("ezreal-core");
const webpackConfig = bootstrap({
// my-preset-react is an npm package or a file
extends: require.resolve('my-preset-react'),
middleware: [
require.resolve('my-middleware-prerender'),
require.resolve('my-middleware-microFrontEnd'),
require.resolve('my-middleware-packageCheck'),
require.resolve('my-middleware-esCheck'),
require.resolve('my-middleware-sentry'),
...
]
}).webpack();
Can provide you with webpackConfig
// examples/simple/webpack.config.js
const bootstrap = require("ezreal-core");
// If there is no .ezrealrc.js
// Can be called directly from a pure function
// bootstrap({
// extends: "ezreal-preset-react"
// }).webpack();
module.exports = bootstrap().webpack();
Provide different user configurations for command line tools
// my-cli.js
const bootstrap = require("ezreal-core");
const webpackConfig = bootstrap().webpack();
Better support for different types of projects
// project-a
// .ezrealrc.js
module.exports = {
extends: "my-preset-mobile" // extends: my-preset-react
}
// project-b
// .ezrealrc.js
module.exports = {
extends: "my-preset-pc" // extends: my-preset-react
}
modules.exports = function MyAnalyzerMiddleware(chain, options) {
if (options.analyze) {
chain
.plugin('webpack-bundle-analyzer')
.use(new BundleAnalyzerPlugin(options.analyze));
}
}
modules.exports = {
extends: require.resolve('ezreal-preset-react'),
middleware: [require.resolve('./my-analyzer-middleware')],
// Set a default value, with a lower priority than the user's configuration
options: {
analyze: true
}
}
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent