Parse-Fehler: Zeile 1: Illegale Einfuhranmeldung

Question

ich mit dem Code Reagieren Anwendung in einer Datei mit dem Namen erstellt App.jsx, die wie folgt beginnt:

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

Als ich npm run erhalte ich:

> 1 | Parse Error: Line 1: Illegal import declaration 
    |  ^
    2 | for file /path/to/file/App.jsx 

Ich schaute online und es scheint, dass die import Anweisung nicht erkannt wird, wenn ich Babel benutze.

Allerdings, was ich verstehe, mit der neuen Create React App https://facebook.github.io/react/blog/2016/07/22/create-apps-with-no-configuration.html gibt es keine Notwendigkeit für Babel.

Was ist der beste Weg, um dieses Problem zu lösen?

Answer 1

Aus dem Link:

Create React App uses both Webpack and Babel under the hood.

Da die aktuellen Browser die Import Aussage nicht unterstützen, haben Sie Babel oder ähnliche

Answer 2

Sie brauchen nicht zu verwenden, um hinzuzufügen Babel zu Ihrem Projekt, weil es bereits in der Entwicklungsumgebung von create-react-app enthalten ist. Sie können Ihre Dateien jedoch nicht einfach direkt ausführen. Sie müssen es so verwenden, wie es in dem Blogpost vorgeschlagen wird, den Sie in Ihrer Frage verlinkt haben.

Answer 3

In der .eslintrc Datei aktivieren Module über ecmaFeatures: { modules: true }

Siehe Illegal import declaration - Issue #2112 für weitere Informationen.