React 引入本地静态文件或图片

之前我们引入图片可以直接使用

<img src="../assets/logo.png" alt="" />

但在React中并不可用

推荐方法一：

import logo from '../../assets/imgUrl/logo.png'
export default function Header() {
    return (
        <div>
            <div className='header'>
                <div className='imgUrl'>
                    <img src={logo} alt="" />
                </div>
            </div>
        </div>
    )
}

通过import引入图片

还有一种方法：

<img src={require("../../assets/imgUrl/logo.png")} alt="" />

通过require引入。

 

以上就是图片的引入，推荐方法1.可以实现变量名