React 装饰器报错

最近在学习react，学到高阶函数装饰器了，使用react-create-app脚手架工具创建了 React项目，当用到装饰器时候发现启动的项目老是报错

 Support for the experimental syntax 'decorators-legacy' isn't currently enabled

网上百度的好几种方法都试过了，都不管用，自己无意间发现了

自己的是 react-scripts

视频里没问题的是 react-app-rewired

换成 react-app-rewired 问题解决，为遇到在学习React路上同样问题的给个参考

react项目利用react-app-rewired实现按需打包

由于create-react-app脚手架工具已经对webpack做了一层封装，所以不太好去配置.babelrc文件,往常实现方式

{
  "plugins": [
    ["import", {
      "libraryName": "antd", //需按需打包的库
      "libraryDirectory": "es",
      "style": "css" 
    }]
  ]
}

所以，我们得借助于react-app-rewired包，（该包是对react-scripts进行了扩展

// 第一步

cnpm  i babel-plugin-import react-app-rewired -D

//第二步 修改package.json文件

"scripts": {
    "start": "react-app-rewired start",  //主要修改就是把以前的react-scripts包替换为react-app-rewired
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-app-rewired eject"
  },
//第三步
在项目根目录下创建config-overrides.js文件

const {injectBabelPlugin} = require('react-app-rewired');
module.exports = function override(config, env) {
    config = injectBabelPlugin(['import', {libraryName: 'antd', style: 'css'}], config);
    return config;
};

上面的如果不行，参照下面的

由于新的 react-app-rewired@2.x 版本的关系，你需要还需要安装 customize-cra。

const { override, fixBabelImports } = require('customize-cra');
  module.exports = override(
  fixBabelImports('import', {
  libraryName: 'antd-mobile',
  style: 'css',
  }),
);

参照