是否可以在 create-react-app 中使用装饰器?

Pat*_*oco 6 javascript reactjs create-react-app

我明白,由于 Babel 不支持开箱即用的装饰器(因为它处于定义的早期阶段) create-react-app 也不支持它。

我知道你可以弹出生成的应用程序并配置 Babel 来支持它们,但我不想这样做。

最后,像 MobX 这样的库允许你使用装饰器的行为,而无需实际使用它们,借助一些实用函数,如https://mobx.js.org/best/decorators.html 中描述的

React 有类似的东西吗?

Tak*_*aki 5

是的,你可以,但你需要一些东西,

请确保您已经反应过来-APP-重新布线定制-CRA安装,以便您可以覆盖的WebPack和巴贝尔CONFIGS

安装@babel/plugin-proposal-decorators

并更新您的config-overrides.js文件:

const { override, addBabelPlugin } = require("customize-cra");
const pluginProposalDecorators = require("@babel/plugin-proposal-decorators");

module.exports = override(  
  addBabelPlugin(pluginProposalDecorators)
);
Run Code Online (Sandbox Code Playgroud)

  • 对我来说,这失败了,因为插件要求设置其选项之一。假设您需要设置“decoratorsBeforeExport”或“legacy”(都是布尔选项),或者其他什么?我不知道。对于其他刚接触这些工具的人来说,这就是最终的工作结果:我用“addBabelPlugin([pluginProposalDecorators, {decoratorsBeforeExport: false}])”替换了 override() 的参数,然后我引用了 https://stackoverflow。 com/questions/52628207/an-element-descriptors-kind-property-must-be-either-method-or-field/61542597#61542597 学习实际使用该插件而不崩溃。 (2认同)