React装饰器的配置

1,698 阅读1分钟

在React项目开发中我们可能在一个页面或者组件中使用多个高阶组件,所以我们这个时候为了方便这个时候配置一个装饰器是非常好的一个选择。 当我们配置完毕装饰器的时候直接@装饰器名称就可以 装饰器配置的步骤: 1、下载装饰器的配置 npm install @babel/plugin-proposal-decorators 或者 cnpm install @babel/plugin-proposal-decorators 或者 yarn add @babel/plugin-proposal-decorators 2、在安装完装饰器后我们需要将隐藏的config文件夹暴露出来 在暴露出来之前我们需要将方木放入到缓存的状态就是git的缓存的状态 1) git add . 2)git commit -m "xxx" 3)npm run eject 这样就可以将我们需要的东西暴露出来 3、在暴露出来后,我们找到package.json文件,然后再bable中添加 "plugins": [ [ "@babel/plugin-proposal-decorators", { "legacy": true } ] ] 因为在项目中为了方便文件夹的调用,所以我们会配置一个config-overrides.js文件,在这里我们需要引用一个东西const {addDecoratorsLegacy} = require('customize-cra') 然后我们需要在这里调用其中的一个函数 addDecoratorsLegacy() 4、4、在这里我们就可以吧装饰器配置完毕了,装饰器配置完毕后必须要重新启动文件,当然在项目中可能会报错,这里的错误信息可能是你暴露出来之后原本下载东西不存在了,然后你可以通过yarn add 安装原本所需要的东西