我使用命令作为波纹管来创建一个新应用程序(使用 react webpack
(
我用了导轨5.1.4
rails new news --database=postgresql --webpack=react
我有一些图像被放在app/assets/images
,所以在文件夹app/javascript/src/components/test.jsx
中,我想显示这个放在assets/images
中的images
。
import React, { Component } from 'react'
import addBanner from 'images/addbanner_728x90_V1.jpg';
class Header extends Component {
render() {
return (
<header id="header">
<img src={addBanner} alt="" />
</header>
)
}
}
这是我的webpacker.yml
default: &default
source_path: app/javascript
source_entry_path: packs
public_output_path: packs
cache_path: tmp/cache/webpacker
# Additional paths webpack should lookup modules
# ['app/assets', 'engine/foo/app/assets']
resolved_paths: ['app/assets']
当我运行rails server
时,图像没有显示在我的网站上。
这是在chrome
debug console
上显示的错误。
GET http://localhost:3000/packs/_/assets/images/addbanner_728x90_V1-b8833c72a88a27dde49f4c9067bef50d.jpg net::ERR_BLOCKED_BY_CLIENT
如何显示此图像?
很可能
是因为名称是 addbanner_...jpg
,它被广告拦截阻止了,因为它认为这是一个广告。尝试禁用广告拦截,或更改图像的名称。