我不能在我的反应应用程序中使用css中的文件夹路径

Question

我无法在我的反应应用程序中设置CSS中的img背景。但是如果我从反应组件设置样式并设置img然后它工作正常，有人可以帮助我

这将起作用

const style={
    width:'300px',
    height:'200px',
    backgroundImage: 'url(pictures/backgroundPics/1.jpg)'
}

const Test =()=>(  
    <div style={style}/>
)

但这不会

import './test.css'

const Test =()=>(  
    <div className='test'/>
)

CSS

.test{
    background-color: gray;
    width: 300px;
    height: 200px;
    background-image: url(../../public/pictures/randomPics/1.jpg)
}

我试图将我的css路径设置为我能想到的许多方法，包括将其设置为相对于css文件或html文件，但它或者给我找不到模块或解析错误。我的测试组件路径是src / test / test.js，我的css文件在同一测试文件夹中。我正在使用css-loader v0.28.4

如果我将网址设置为网址

，则会有效

background-image: url(http://www.pvhc.net/img226/gzypyldoqaxjhvtyyhei.png)

Answer 1

不需要相对论参考CSS中的public目录。你试过了吗？

background-image: url(/pictures/randomPics/1.jpg)