IMGは、私は私のコンポーネントで画像をロードしようとしていますコンポーネント

Question

リアクトでロードされていません。

import React from 'react'; 
import style from './Sidebar.scss'; 

const Sidebar =() => (
    <nav className={style.sidebar}> 
    <ul className={style.wrapper}> 
     <li className={style.item}> 
     <div> 
      <img className={style.logo} src="../../img/myImg.png" alt="contactto logo" /> 
     </div> 
     </li> 
    </ul> 
    </nav> 
); 

export default Sidebar; 

をしかし、私がRobotoフォントをロードしていますし、正常に動作している、機能していません。ここで

はwebpack.configから私のスニペットコードです：

{ 
     test: /\.(eot|svg|ttf|woff|woff2)$/, 
     loader: 'file-loader?name=fonts/[name].[ext]', 
     }, 
     { 
     test: /\.(png|svg|jpg)$i/, 
     use: { 
      loader: 'file-loader?name=img/[name].[ext]', 
     }, 
     }, 

私のIMGは私のdistフォルダにコピーされません。あなたが最初にそのイメージをimportする必要が

Answer 1

：

import Image from '../../img/myImg.png'; 

そして、この画像を使用するには、次のように：あなたは ：予期しない文字 ''（0 1：）

img className = {style.logo} src = {Image} alt = "contactto logo" />