乐趣区

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

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()
)
退出移动版