create-react-app脚手架搭建后如何使项目支持修饰器语法

create-react-app搭建react项目后，是不支持修饰器语法的。react-scripts库已经提供了打包cli命令以及常规的构建配置，如果需要使用一些使用时特性，比如修饰器等，需要另外注入

正好，官网提供react-app-rewired库，可能帮助我们注入自定义构建配置

首先，安装react-app-rewired

yarn add react-app-rewired -S

将react-scripts全部替换成react-app-rewired：

"scripts": {
    "start": "react-app-rewired start",
    "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([
        "@babel/plugin-proposal-decorators", { "legacy": true }
    ], config)
    return config;
}

执行npm run start后提示我们使用customize-cra自定义配置

进去customize-cra官网了解一下如何使用

照着上面配置就可以让项目支持修饰器语法了

const { 
    override,
    addDecoratorsLegacy, 
} = require('customize-cra');

module.exports = override(
    addDecoratorsLegacy()
)