Почему Babel не передает мой импорт приложения React? - PullRequest
Новая
       40

Почему Babel не передает мой импорт приложения React?

0 голосов
/ 19 декабря 2018

Я установил приложение React с использованием CRA, а затем также сервер Express (генератор), на котором я должен сделать SSR.

Моя текущая папка выглядит примерно так: 

app/
  public/
  src/ (React application source files)
  server/ (Express)
    .babelrc
    src/ (Source files for Express server)
      bin/
        www
      middleware/
        serverRenderer.js
      ...
      app.js

У меня установлены следующие пакеты Babel: 

"@babel/cli": "^7.2.0",
"@babel/core": "^7.2.2",
"@babel/node": "^7.2.2",
"@babel/preset-env": "^7.2.0",
"@babel/register": "^7.0.0",
"babel-preset-react-app-babel-7": "^4.0.2-0"

Я запускаю сервер Express с помощью следующей команды: 

"server:dev": "NODE_ENV=development PORT=3001 nodemon ./server/src/bin/www --exec babel-node"

Мое промежуточное ПО, serverRenderer.js имеетследующий код: 

import React from 'react'
import ReactDOMServer from 'react-dom/server'
import App from '../../../src/App';

module.exports = function(req, res, next){
    console.log("Middleware to render React app...!")
    next();
}

Файл www (внутри bin /) начинается с: 

require('ignore-styles');
require('@babel/register');

Когда я запускаю сервер Express, вызывается мое промежуточное программное обеспечение, и правопрочь я получаю эту ошибку, указывая на мой код JSX .. App.js: Unexpected token

Что здесь происходит?Я не могу понять, почему это не работает, что мне не хватает?

Спасибо

ОБНОВЛЕНИЕ

Предоставление дополнительной информации.

App.js

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

class App extends Component {
  render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <p>
            Edit <code>src/App.js</code> and save to reload.
          </p>
          <a
            className="App-link"
            href="https://reactjs.org"
            target="_blank"
            rel="noopener noreferrer"
          >
            Learn React
          </a>
        </header>
      </div>
    );
  }
}

export default App;
...