我无法导入该文件

时间:2019-05-05 18:40:57

标签: javascript reactjs

我尝试导入的这张图片不会显示在我的网页上。我是新来的人,对此感到非常沮丧,我已经阅读了Facebook文档,但仍然迷路。请帮助。 init(_:) 我正在尝试将文件路径记录到控制台,但这是未定义的

import React, { Component } from 'react';
import {Link} from 'react-router-dom';
import computer from './computer.png';

class Home extends Component {    


  render() {
    return (
      <div className="main-content home">
       <div>  
       <img src={compter} title='computer' />       
       </div>
       <small className="description">  </small><br/>
       <small className="description"> Miami,FL </small>
        <p className="about">Hello, and thank you for visiting my website. I have always been a computer guy I remember inspecting elements in middle school and changing some text and thinking I hacked the school website. To then creating my own website with basic HTML and CSS in high school. </p>
        <br/>
        <p className="about">From there I decided to go to college for Computer Science where I studied languages like C++ and learned how to think like a programmer. The ability to create things you think of into a real space fascinates me. I love solving problems and being creative so programming is perfect for me it seems as it has always been a part of my life. Currently, I am learning more frameworks next I plan to learn back-end and in a few years delv into machine learning.</p>
        {/* Add Email Button */}
        <a  href="https://mail.google.com/mail/?view=cm&fs=1&to=tyriquedaniel14@gmail.com,tyrique1.daniel@gmail.com&su=Programming-Inquiry&body=BODY" target="_blank"rel="noopener noreferrer" className="email">
            Email Me
        </a>

        <a  href="https://drive.google.com/file/d/1o5Fxe49MugM1b2Z6IW2lN6s1gXqmvcTf/view?usp=sharingn" target="_blank" rel="noopener noreferrer" className="email">
            Resume        
          </a>

          <ul>
        <li><a href="https://www.linkedin.com/in/tyrique-daniel-764586b5/" className="social linkedin" target="_blank rel="noreferrer="">LinkedIn</a></li>
        <li><a href="https://github.com/CodingOni" className="social github" target="_blank"  rel="noopener noreferrer">Github</a></li>
        <li><a href="https://www.sololearn.com/Profile/280099/?ref=app" className="social sololearn" target="_blank rel="noreferrer="">SoloLearn</a></li>
        <li><a href="https://www.sololearn.com/Profile/280099/?ref=app" className="social SO" target="_blank rel="noreferrer="">SoloLearn</a></li>

      </ul>
        <hr />
        <h3>What i am currently Using </h3>
        <Link to="/teachers" >HTML</Link>
        <Link to="/teachers" >Javascript</Link>
        <Link to="/teachers" >React </Link>
        <Link to="/teachers" >CSS</Link>
        <Link to="/teachers" >BootStrap</Link>
        <Link to="/teachers" >Docker</Link>
        <Link to="/teachers" >NPM</Link>
        <Link to="/teachers" >Accessibility/Mobile Responsive</Link>









      </div>

    );

  }
}

export default Home;

我希望这张照片出现

2 个答案:

答案 0 :(得分:0)

import语句仅适用于模块。 尝试require('./computer.png')

答案 1 :(得分:0)

您使用的拼写错误,它必须是comp(U)ter而不是compter

<img src={computer} title='computer' />

小建议:如果您没有状态,请使用无状态方法