按需加载需要的包 babel-plugin-import 装饰器语法需要的包 @babel/plugin-proposal-decorators
dva框架
将.webpackrc 改成.webpackrc.js然后具体配置
const config = {};
config.proxy = {
"/api": {
"target": "http://localhost:7001",
"changeOrigin": true,
"pathRewrite": {
"^/api": ""
}
}
} config.extraBabelPlugins = [
//antd按需加载引入
["import", {
"libraryName": "antd",
"libraryDirectory": "es",
"style": "css"
}],
//装饰器语法配置
[
"@babel/plugin-proposal-decorators",
{
"legacy": true
}
]
] export default config;
在 creat-react-app创建的脚手架配置
建个.babelrc
{
"presets": [
"react-app"
],
"plugins": [
[
"import",
{
"libraryName": "antd",
"libraryDirectory": "es",
"style": "css" // `style: true` 会加载 less 文件
}
],
[
"@babel/plugin-proposal-decorators",
{
"legacy": true
}
]
]
}
装饰器 语法使用之前 拿antd的包为例子
// const WrappedNormalLoginForm = Form.create({ name: 'normal_login' })(Login);
// export default WrappedNormalLoginForm; 抛出的是这个改变后的变量 而不是Login这个组件了
使用后
@Form.create({ name: 'normal_login' }) 注意这里不要加分号 放在class上面
export default Login