Babel 插件类属性 – React 箭头函数

Posted 2023-02-22

【中文标题】Babel 插件类属性 – React 箭头函数

【英文标题】：Babel Plugin Class Properties – React Arrow Functions

【发布时间】：2019-05-23 19:03:41

【问题描述】：

我正在使用 npm 运行一个 React 项目。经过数小时的研究和试验，到处都说我必须将以下代码添加到我的“.babelrc”文件中，而我的目录中没有该文件并且无法创建：

  "plugins": [
    ["@babel/plugin-proposal-class-properties",  "loose": true ]
  ]

但这会导致我在运行代码时出现以下错误：

ERROR in ./src/components/NavBar/Menu.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /Users/ymoondhra/Desktop/yt-web/src/components/NavBar/Menu.js:
Support for the experimental syntax 'classProperties' isn't currently enabled
 (20:10):
  18 |     
  19 | 
> 20 |     fast = () => 
     |          ^
  21 |         this.speed = 100;
  22 |     
  23 | 
Add @babel/plugin-proposal-class-properties (https://git.io/vb4SL) to the 'plugins' 
section of your Babel config to enable transformation.

【参考方案1】：

3 小时后找到了我的问题的解决方案： --在根目录下创建一个名为“babel.config.js”的文件。 ——把它放在文件里。 --重新运行程序（即 npm start）。

module.exports = 
  presets: [ "@babel/preset-env", "@babel/preset-react" ],
  plugins: [ "@babel/plugin-transform-arrow-functions", "@babel/plugin-proposal-    class-properties" ]

【讨论】：

是否需要额外设置？即 package.json

我花了很长时间才让它工作。我只是在更改文件名，但缺少 modules.exports。很棒的帖子。

它会覆盖 .babelrc 吗？