Как исправить импорт / экспорт babel-eslint без файла конфигурации? - PullRequest
0 голосов
/ 14 июня 2019

Когда я нажимаю npm start, у меня появляется следующая ошибка:

Parsing error: 'import' and 'export' may only appear at the top level

Когда я посмотрел на эту ошибку, они сказали, что мне нужно обновить файл конфигурации eslint, а в параметрах парсера поставить true и все.Но у меня нет файла конфигурации eslint, и мой пакет json выглядит следующим образом:

{
  "name": "client",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@material-ui/core": "^3.6.1",
    "@material-ui/icons": "^3.0.1",
    "material-icons-react": "^1.0.4",
    "react": "^16.6.3",
    "react-dom": "^16.6.3",
    "react-scripts": "2.1.1",
    "truffle-contract": "^4.0.0-beta.1",
    "web3": "^1.0.0-beta.36"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

Обновление: вся ошибка:

./src/App.js
  Line 131:  Parsing error: 'import' and 'export' may only appear at the top level

  129 |     );
  130 | 
> 131 |   export default App;
      |   ^
  132 | 
  133 |       <div id="dashboard">
  134 |         <div className="menu">

Ссылка на мой код App.js:

ссылка на код моего github моего app.js

Ошибка обновления 2:

./src/Article.js
  Line 11:  Parsing error: Unexpected token, expected ","

   9 |       return (
  10 |         {/* sorting articles by score */}
> 11 |         articles.sort(function (a, b) {
     |         ^
  12 |           return a.score - b.score;
  13 |         });
  14 |

код github моего Article.js

1 Ответ

0 голосов
/ 14 июня 2019

import и export операторы не могут быть внутри определения функции или класса, они должны быть на уровне модуля.

import something from './file'; // <-- module level, outside function

function App() {
  export default App; // <-- inside function, this will break everything
  return <div>Hello</div>
}

export default App // <-- module level, outside function

Ошибка довольно очевидна: у вас есть дополнительный оператор export в середине вашего render метода.

Похоже, у вас есть какой-то дублированный код render. Удалите эти строки: https://github.com/AdenSTL/stackoverflow-errors/blob/master/App.js#L131-L153

так что render выглядит так:

  render() {
    return (
      <AppBar position="static">
        <div id="dashboard">
          <div className="menu">
            <MenuItem onClick={this.handleClose}>
              <NavLink exact to="/CardStack">
                Home
              </NavLink>
            </MenuItem>
            <MenuItem onClick={this.handleClose}>
              <NavLink exact to="/Article" >
                Article
              </NavLink>
            </MenuItem>
          </div>
          <div className="content">
            <Route exact path="/CardStack" component={CardStack} />
            <Route exact path="/Article" component={Article} />
          </div>
        </div>
      </AppBar>
    );
  }
...