我无法在我的反应应用程序中使用 css 中的文件夹路径答案

【问题标题】：I cannot use folder path in css in my react app我无法在我的反应应用程序中使用 css 中的文件夹路径
【发布时间】：2018-01-19 10:36:07
【问题描述】：

我在我的 react 应用程序中根本无法在 css 中设置 img 背景。但是如果我从 react 组件中设置样式和设置 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)

【问题讨论】：

标签： css reactjs background-image css-loader

【解决方案1】：

没有必要在你的 CSS 中引用 public 目录。你试过了吗：

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

【讨论】：

它对我不起作用，我试过了。我在我的问题中包含了我的错误，请看一下，谢谢
我的意思是包含/pictures 而不是pictures。我更新了上面的sn-p。