babel-plugin-recharts
A babel plugin help you import less Recharts modules.
install
$ npm i -D babel-plugin-rechartsExample
The plugin automatically compiles recharts import, like this:
import { Line, Area, Pie, Treemap, Cell } from 'recharts';babel plugin will be parsed into:
"use strict";
require("recharts/lib/polyfill.js");
var _Line = _interopRequireDefault(require("recharts/lib/cartesian/Line.js"));
var _Area = _interopRequireDefault(require("recharts/lib/cartesian/Area.js"));
var _Treemap = _interopRequireDefault(require("recharts/lib/chart/Treemap.js"));
var _Pie = _interopRequireDefault(require("recharts/lib/polar/Pie.js"));
var _Cell = _interopRequireDefault(require("recharts/lib/component/Cell.js"));
var _recharts = _interopRequireDefault(require("recharts"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }Hence you end up loading less modules.
Usage
You can choose to either edit your custom Babel configuration or your Webpack configuration. Both options work..
.babelrc
{
"plugins": ["recharts"]
...
}webpack.config.js
'module': {
'loaders': [{
'loader': 'babel-loader',
'test': /\.js$/,
'exclude': /node_modules/,
'query': {
'plugins': ['recharts'],
...
}
}]
}Limitations
- You must use ES2015 imports to load recharts
License
Copyright (c) 2015-2021 Recharts Group