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"
    ]
  },