reactjs:导入净空后出现错误

Question

我是react的新手，在我的react应用程序中，我试图使用"react Headroom"，但在导入后，我得到了这个SyntaxError"当前未启用对实验语法‘classProperties’的支持(10:20(：">

import React from 'react';
import Headroom from 'react-headroom/src';
import './App.css';
function App() {
return (
<div className="App">
<Headroom>
<nav>
...
</nav>
</Headroom>
</div>
);
}

导出默认应用程序；

Answer 1

将注释转换为答案

通常不会从src目录导入
尝试仅从'react-headroom'导入。

Answer 2

您需要使用syntax-class-properties插件。使用安装

yarn add babel-plugin-syntax-class-properties

然后将其添加到您的.babelrc:

{
"plugins": ["syntax-class-properties"]
}

Answer 3

只需确保在.babelrc文件中使用了正确的插件

"babel": {
"presets": [
"@babel/preset-env",
"@babel/preset-react"
],
"plugins": [
"@babel/plugin-proposal-class-properties"
]
},