在使用antd-mobile中的组件的时候,遇到了一些比较棘手的问题,经过查找相关资料和网上的帮助,在此整理出了问题以及解决办法:

在引入antd-mobile的时候,根据官网提供的文档:

1,首先安装antd-mobile,

2,其次安装依赖,引入babel-plugin-import这个按需加载插件,在.bablerc中添加插件配置

"plugins": ["transform-runtime", "react-html-attrs", ["import", { "style": "css", "libraryName": "antd-mobile" }]],

3,在webpack配置中添加.web.js后缀

 extensions: ['.web.js', '.js', '.jsx', '.json'],

4,最后在需要使用到antd-mobile组件的地方就可以引入了

import Toast from 'antd-mobile/lib/toast/index.web';
import 'antd-mobile/lib/toast/style/index.css';

  

使用antd-mobile遇到的坑的更多相关文章

  1. Antd前端开发采坑记录

    背景 基于页面友好,界面整洁美观:基于Antd框架开发虾能平台 选型 基于Antd-admin工程架构,进行开发:基于Antd+React+Umj 采坑记录 按照Html方式天机onClick方法,每 ...

  2. 【零售App】—— react/ant design mobile项目爬坑

    一.H5制作 - 图片文本的动画效果 bug:打开一个模板,添加图片,添加动画效果,若先选定动画效果,再调节动画时间和延迟时间,则动画和延迟时间没有改变:若先调节动画时间和延迟时间在选定动画效果,则动 ...

  3. ANTD mobile源码分析 -- popover

    最近的开发中要用到很多的各式各样的组件.但是发现ant design mobile(后面简称ANTDM)里很多的资源.于是就分析一下,学习学习. ANTDM直接使用了typescript,没有用ES2 ...

  4. dvajs+antd定制主题踩坑记录

    记一下刚刚解决的问题,困扰了几周,期间困兽争斗,甚至想放弃antd组件库.终于出来了,人类科技又进步了(才怪). 首先我按照dva官网建立了项目.里面引入antd的各种组件,因为需要用到一个switc ...

  5. 移动APP开发框架盘点2:Web移动前端框架大全

    前言 自上次发布了<移动APP开发框架盘点>后,时间已经过去了三年, 为什么突然又写一篇续集呢?是因为有一个非常有意思的发现. 开源项目其实有一个成熟周期,这个周期大概是三年左右,自Rea ...

  6. web前端学习路线(含20个真实web开发项目集合)

    目前web前端工程师日均岗位缺口已经超过50000,随着互联网+的深入发展,html5作为前端展示技术,市场人才需求量将呈直线上涨. Web前端工程师的岗位职责是利用HTML.CSS.Java.DOM ...

  7. React+DvaJS 之 hook 路由权限控制

    博客 学院 下载 GitChat TinyMind 论坛 APP 问答 商城 VIP 活动 招聘 ITeye 写博客 发Chat 登录注册 原 React+DvaJS 之 hook 路由权限控制 20 ...

  8. 适合 JS 新手学习的开源项目——在 GitHub 学编程

    作者:HelloGitHub-小鱼干 这里是 HelloGitHub 的<GitHub 上适合新手的开源项目>系列的最后一篇,系列文章: C++ 篇 Python 篇 Go 篇 Java ...

  9. 我们一起踩过的坑----react(antd)(二)

    1.antd Upload默认值问题 需求是这样的,后台若没有图片默认值,则只有上传按钮,且只能上传一张图片:若有默认值,则显示默认头像图片, 可删除,删除之后有且只能添加一张图片,没有删除默认图片时 ...

  10. React+Antd遇到的坑

    第一次尝试React+antd,发现果然不愧是传说中的坑货,一个又一个坑.必须要记录. react + antd,都是最新版本,使用npm和yarn各种add,build,start 1. 资源文件, ...

随机推荐

  1. Kubernetes 证书详解

    K8S 证书介绍 在 Kube-apiserver 中提供了很多认证方式,其中最常用的就是 TLS 认证,当然也有 BootstrapToken,BasicAuth 认证等,只要有一个认证通过,那么 ...

  2. 微软New Bing Chat AI聊天免费体验(需要魔法~)

    必应聊天是什么? Bing Chat是一个AI 聊天机器人,它可以理解您问题的上下文并以人性化的方式回复.Microsoft 已将此功能直接集成到Bing 搜索中,使 Bing 成为搜索结果和AI 支 ...

  3. super在python 2.7和Python3中的使用

    重写是继承机制中的重要内容,对于构造方法尤为重要.构造方法用来初始化新建对象的状态,大多数子类不仅要有自己的初始化代码,还要拥有超类的初始化代码.如果一个类的构造方法被重写,那么就需要调用超类的构造方 ...

  4. ENVI指定像元数量(行数与列数)裁剪栅格图像

      本文介绍基于ENVI软件,实现栅格遥感影像按照像元行列号与个数进行指定矩形区域裁剪的方法.   一般的,如果我们需要裁剪某个具体的行政区域,按照对应区域的矢量图层裁剪即可:如果需要裁剪某个大致的区 ...

  5. 2023-06-08:给你一棵二叉树的根节点 root ,返回树的 最大宽度 。 树的 最大宽度 是所有层中最大的 宽度 。 每一层的 宽度 被定义为该层最左和最右的非空节点(即,两个端点)之间的长度

    2023-06-08:给你一棵二叉树的根节点 root ,返回树的 最大宽度 . 树的 最大宽度 是所有层中最大的 宽度 . 每一层的 宽度 被定义为该层最左和最右的非空节点(即,两个端点)之间的长度 ...

  6. 大家都说Java有三种创建线程的方式!并发编程中的惊天骗局!

    在Java中,创建线程是一项非常重要的任务.线程是一种轻量级的子进程,可以并行执行,使得程序的执行效率得到提高.Java提供了多种方式来创建线程,但许多人都认为Java有三种创建线程的方式,它们分别是 ...

  7. @Document元注解的使用

    @Documented注解标记的元素,Javadoc工具会将此注解标记元素的注解信息包含在javadoc中.默认,注解信息不会包含在Javadoc中.示例如下: 声明Book注解,并使用@Docume ...

  8. mysql concat函数的用法

    mysql中的这个函数非常强大,可以对查出的参数进行拼接,其实这个方法在java中也有api可以进行调用. 那么什么时候进行使用呢?例如,你老大叫你做一个数据库的数据采集,需要整理成文档,那么这个时候 ...

  9. k3s 基础 —— 配置 loki

    官方文档 核心组件 3 个 chart: promtail 这是一个 agent 代理客户端,用于收集日志,将日志传送给 loki loki 核心组件,主要功能是日志数据的写入与分析.包含 gatew ...

  10. PlayWright(十二)- PO模式

    1.PO模式是什么? PO,即Page Object,直译为页面对象,代表 Web 应用程序的一部分   具体什么意思呢,通俗来讲,一个页面有输入.点击.搜索功能,而且有很多页面,这时候我们就采用每个 ...