javascript - 如何在不使用 Webpack 的情况下从公共(public)文件夹获取图像

标签 javascript reactjs webpack

我已经阅读了很多关于使用 Webpack 从公共(public)文件夹获取图像的帖子。但是,如果没有 Webpack,是否仍然可以这样做?

我的代码结构:

./public/logo.png
./src/../source_file.js (which renders an <img> and that needs to be pointed to the logo image

我试过 import img from './logo.png' 但这不起作用。还尝试了相对路径,但 reactjs 阻止我导入 src 文件夹之外的任何内容。

最佳答案

只要您的 package.json 位于根目录下,它就可以工作:

import logo from '../../public/logo.png';

const MyComponent = () => (<div>
 <img src={logo} alt={"logo"} /> 
</div>);
export default MyComponent;

否则,假设您正在复制 /public文件夹到你的网络服务器的根目录,你也可以简单地做 <img src="/logo.png" alt="logo">

关于javascript - 如何在不使用 Webpack 的情况下从公共(public)文件夹获取图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51505427/

相关文章:

php - PHP执行前的确认提示

JavaScript 依赖管理

MobX 中的 Ajax 调用 : MobX observer: Store is not available! 确保它是由某个 Provider 提供的

ReactJS 组件始终使用外部库重新渲染

javascript - Webpack 只加载 css 引用的图像。不加载js引用的图片

css - 获取 : Unexpected token { expected ; while parsing pure CSS file

javascript - jQuery:删除结束标记

javascript - React 不映射数组中的某些对象

webpack - 如何使用 nunjucks 文件作为 webpack 的入口点?

javascript - 使用 z-index 选中复选框时创建颜色叠加