react中非弹射方式配置装饰器

react中非弹射方式配置装饰器

在 cra 中使用非 eject 方式启用 decorator

初始化

create-react-app app-study

安装改变 create-react-app 中 webpack 配置插件

yarn add -D react-app-rewired customize-cra @babel/plugin-proposal-decorators

在项目根目录下创建 config-overrides.js 并写入以下内容

const { override, addDecoratorsLegacy } = require("customize-cra")ports = override(addDecoratorsLegacy()
)

修改 package.json 文件中 scripts 脚本

  /* package.json */"scripts": {
-   "start": "react-scripts start",
+   "start": "react-app-rewired start",
-   "build": "react-scripts build",
+   "build": "react-app-rewired build",
-   "test": "react-scripts test --env=jsdom",
+   "test": "react-app-rewired test --env=jsdom"
}

重新启动项目

yarn start