版权声明：本文为博主原创文章，遵循 CC 4.0 by-sa 版权协议，转载请附上原文出处链接和本声明。 本文链接：https://blog.csdn.net/yulinjiayuan/article/details/99712090

按需加载需要的包  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

1 {
2     "presets": [
3         "react-app"
4     ],
5     "plugins": [
6         [
7             "import",
8             {
9                 "libraryName": "antd",
10                 "libraryDirectory": "es",
11                 "style": "css" // `style: true` 会加载 less 文件
12             }
13         ],
14         [
15             "@babel/plugin-proposal-decorators",
16             {
17                 "legacy": true
18             }
19         ]
20     ]
21 }

 

 

装饰器 语法使用之前  拿antd的包为例子

// const WrappedNormalLoginForm = Form.create({ name: 'normal_login' })(Login);
// export default WrappedNormalLoginForm;        抛出的是这个改变后的变量  而不是Login这个组件了   使用后   @Form.create({ name: 'normal_login' })     注意这里不要加分号  放在class上面   export default Login