如果使用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. P2336 [SCOI2012]喵星球上的点名(SA+莫队)

    题面传送门 一道还算有点含金量的 SA 罢-- 首先按照套路我们把读入的所有字符串都粘在一起,中间用分隔符隔开并建出后缀数组出来. 我们考虑对于一个固定的字符串 \(s\),什么样的字符串 \(t\) ...

  2. Redis list操作命令

    rpop命令 用于移除列表的最后一个元素,返回值为移除的元素.当列表不存在时,返回nil. 基本语法: rpop key_name LPOP:移除并返回列表第一个元素 RPOP:移除并返回列表最后一个 ...

  3. 感谢 git

    今天对程序大修了一下,顺便把所有算例测试了一遍,突然发现二维浅水方程有些算例出现了明显的错误. 这次突然出现的错误让我有点措手不及,因为一直没有修改过浅水方程求解器,所以这些算例很久没有测试过了.硬着 ...

  4. ZAQI

    mysql> CREATE TABLE emploee ( -> name CHAR(64) NOT NULL, -> email CHAR(64), -> password ...

  5. Python基础之变量与常量

    目录 1. 变量 1.1 变量的定义和组成 1.2 变量名的命名规则 1.3 变量名的两种风格 2. 常量 3. 变量内存管理 3.1 变量的存储 3.2 垃圾回收机制 3.2.1 引用计数 3.3 ...

  6. header 301,显示302

    header 301,显示302 一定要注意Location 后面的":"前后都不能有空格 header('HTTP/1.1 301 Moved Permanently'); he ...

  7. 03 Windows安装Java环境

    Java环境安装 使用微信扫码关注微信公众号,并回复:"Java环境",免费获取下载链接! 1.卸载(电脑未装此程序,跳过此过程)    找到电脑上面的控制面板    找到这两个文 ...

  8. Azure Key Vault(二)- 入门简介

    一,引言 在介绍 Azure Key Vault 之前,先简单介绍一下 HSM(硬件安全模块). -------------------- 我是分割线 -------------------- 1,什 ...

  9. Scala(五)【集合的高级使用】

    目录 一.集合属性 size length contains mkString 二.集合方法 drop.dropRight distinct:去重 head.last:获取第一个.最后一个元素 tai ...

  10. 大数据学习day39----数据仓库02------1. log4j 2. 父子maven工程(子spring项目的创建)3.项目开发(埋点日志预处理-json数据解析、清洗过滤、数据集成实现、uid回补)

    1. log4j(具体见log4j文档) log4j是一个java系统中用于输出日志信息的工具.log4j可以将日志定义成多种级别:ERROR  /  WARN  /  INFO  /  DEBUG ...