无法将组件添加到App JS文件

时间:2019-07-22 22:42:55

标签: reactjs

我刚刚创建了一个js文件组件,但是当我将其导入到App js文件中时,它给了我错误。我是否导入了错误的组件文件?

我试图重新创建文件,但是它不起作用。

这是我的App js文件:

import logo from './logo.svg';
import './App.css';

//Component
import City from './components/City';

class App extends Component {

  render(){
    return (
      <div className="App">
        <header className="App-header">
          //Adding component
          <City />
          <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;

这是我的组件js文件:


class City extends Component {

  render(){
    return(
      <div>
        <h1>Hola componente</h1>
      </div>
    );
  }

}

export default City;

这是我在package.json中的依赖项

{
  "dependencies": {
    "axios": "^0.19.0",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "3.0.1"
  }
}```



console shows this error:

Uncaught SyntaxError: Unexpected token !

!(function webpackMissingModule() { var e = new Error("Cannot find module 'react'"); e.code = 'MODULE_NOT_FOUND'; throw e; }());
var _jsxFileName = "D:\\react\\practica\\src\\components\\City.js";


class City extends !(function webpackMissingModule() { var e = new Error("Cannot find module 'react'"); e.code = 'MODULE_NOT_FOUND'; throw e; }())

2 个答案:

答案 0 :(得分:0)

您需要将react导入到您的组件文件中

import React, { Component } from 'react'

答案 1 :(得分:0)

您忘记了导入react和component!

import React, {Component} from 'react';