如果使用create-react-app和require导入图像，require返回一个ES模块而不是字符串。这是因为在file-loader中，esModule选项是默认启用的。

用以下方式之一导入图像：

const image = require('../path/to/image.jpg').default;

// OR

import image from '../path/to/image.jpg';

在react项目中使用require引入图片不生效的更多相关文章

  1. 【已解决】React项目中按需引入ant-design报错TypeError: injectBabelPlugin is not a function

    react项目中ant-design按需加载,使用react-app-rewired的时候报错 运行npm start或者yarn start报如下错误: TypeError: injectBabel ...

  2. vue-cli3项目中解决动态引入图片img404的问题

    博主最近手头再做一个项目,需要调用天气接口,并且还要动态显示天气相关图片icon. 本来以为没什么大问题,结果硬生生被这个动态图片路径搞得民不聊生(博主还是 too young,too simple~ ...

  3. vue中的js引入图片，必须require进来

    需求:如何components里面的index.vue怎样能把assets里面的图片拿出来. 1.在img标签里面直接写上路径: <img src="../assets/a1.png& ...

  4. react项目中引入了redux后js控制路由跳转方案

    如果你的项目中并没有用到redux,那本文你可以忽略 问题引入 纯粹的单页面react应用中,通过this.props.history.push('/list')就可以进行路由跳转,但是加上了redu ...

  5. vue中的js引入图片，使用require相关问题

    vue中的js引入图片,必须require进来 或者引用网络地址 <template> <div class="home"> <img alt=&qu ...

  6. 如何优雅地在React项目中使用Redux

    前言 或许你当前的项目还没有到应用Redux的程度,但提前了解一下也没有坏处,本文不会安利大家使用Redux 概念 首先我们会用到哪些框架和工具呢? React UI框架 Redux 状态管理工具,与 ...

  7. React项目中使用Mobx状态管理（二）

    并上一节使用的是普通的数据状态管理,不过官方推荐使用装饰器模式,而在默认的react项目中是不支持装饰器的,需要手动启用. 官方参考 一.添加配置 官方提供了四种方法, 方法一.使用TypeScrip ...

  8. 在react项目中使用ECharts

    这里我们要在自己搭建的react项目中使用ECharts,我们可以在ECharts官网上看到有一种方式是在 webpack 中使用 ECharts,我们需要的就是这种方法. 我们在使用ECharts之 ...

  9. 优雅的在React项目中使用Redux

    概念 首先我们会用到哪些框架和工具呢? React UI框架 Redux 状态管理工具,与React没有任何关系,其他UI框架也可以使用Redux react-redux React插件,作用:方便在 ...

随机推荐

  1. Atcoder Regular Contest 125 E - Snack（最小割转化+贪心）

    Preface: 这是生平第一道现场 AC 的 arc E,也生平第一次经历了 performance \(\ge 2800\)​,甚至还生平第一次被 hb 拉到会议里讲题,讲的就是这个题,然鹅比较尬 ...

  2. Perl 语言入门1-5

    第一章 简介 perl -v 文字处理,编写小型CGI脚本(Web服务器调用程序)的最佳语言 CPAN: Perl综合典藏网 shebang: #! /usr/bin/perl 或#! /usr/lo ...

  3. mongodb-to-mongodb

    python3用于mongodb数据库之间倒数据,特别是分片和非分片之间. 本项目是一个集合一个集合的倒. 参考了logstash,对于只增不减而且不修改的数据的可以一直同步,阻塞同步,断点同步.改进 ...

  4. .net与java建立WebService再互相调用

    A: .net建立WebService,在java中调用. 1.在vs中新建web 简单修改一下Service.cs的[WebMethod]代码: using System; using System ...

  5. 使用SpringBoot实现登录注册的几个问题

    一.用户名密码都正确的情况下被登录拦截器拦截 控制台报错:org.apache.ibatis.executor.ExecutorException: A query was run and no Re ...

  6. git 新建分支并切换到该分支_Git 从master拉取代码创建新分支 并且再将修改合并到master...

    开发过程中会从master主分支copy到另一个开发分支: 1.切换到master分支 git  checkout  master 2.获取最新的代码 git pull origin master 3 ...

  7. Echart显示后端mysql数据

    一.基本思想 1.将数据存储在mysql数据库中 2.后端链接数据库,将数据库中的数据保存为json格式 3.将json格式数据使用ajax传到前端JSP页面中的Echarts 二.实现的关键点 1. ...

  8. A Child's History of England.48

    A few could not resolve to do this, but the greater part complied. They made a blazing heap of all t ...

  9. Java SSLSocket

    Java SSLSocket JSSE(Java Security Socket Extension)是Sun公司为了解决互联网信息安全传输提出的一个解决方案,它实现了SSL和TSL协议,包含了数据加 ...

  10. Shell学习（二）——变量和基本数据类型

    参考博客: [1]LinuxShell脚本--变量和数据类型 [2]shell只读变量删除 一.变量 定义变量的语法 定义变量时,变量名和变量值之间使用"="分隔,并且等号两边不能 ...