在使用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. Vue cli3 整合SuperMap巧遇js异步加载的坑

    最近使用到superMap做三维地图,而项目又分为可视化大屏与后台管理系统两部分,所以项目配置了多入口,然引入cesium依赖就成了问题,在vue cli3 整合Cesium,处理build 时内存溢 ...

  2. 单例bean与类加载过程

    构造单例bean的方式有很多种,我们来看一下其中一种,饿汉式 public class Singleton1 implements Serializable { //1.构造函数私有 private ...

  3. 5.5. Java并发工具类(如CountDownLatch、CyclicBarrier等)

    5.5.1 CountDownLatch CountDownLatch是一个同步辅助类,它允许一个或多个线程等待,直到其他线程完成一组操作.CountDownLatch有一个计数器,当计数器减为0时, ...

  4. OCR -- 文本检测 - 训练DB文字检测模型

    百度飞桨(PaddlePaddle) - PP-OCRv3 文字检测识别系统 预测部署简介与总览 百度飞桨(PaddlePaddle) - PP-OCRv3 文字检测识别系统 Paddle Infer ...

  5. selenium-wire简介

    一.简介 以下来自chatGPT回答: selenium-wire是一个基于selenium的Python库,它扩展了selenium的功能,使得我们可以在自动化测试中直接访问和修改浏览器的网络请求和 ...

  6. 做副业的我很迷茫,但ChatGPT却治好了我——AI从业者被AI模型治愈的故事

    迷茫,无非就是不知道自己要做什么,没有目标,没有方向. 当有一个明确的目标时,往往干劲十足.但做副业过程中,最大的问题往往就是 不知道自己该干什么. 干什么?怎么干?干到什么程度?这是做副业(甚至任何 ...

  7. Java String、StringBuilder、StringBuffer类

    1.String类 创建字符串对象后,字符串对象不可以发生改变,并且这个字符串对象存储在方法区中的字符串常量池中. 即使想改变字符串对象,那么也只是在字符串常量池中重新创建了一个字符串对象而已. 2. ...

  8. php发起支付加密数据供获取订单状态使用

    <?php//作者主页: https://www.bz80.comnamespace Index\Controller; class PayController extends BaseCont ...

  9. BeanDefinitionStoreException: Failed to read candidate component class

    ssm 整合时出现问题 org.springframework.beans.factory.BeanDefinitionStoreException: Failed to read candidate ...

  10. Go 语言的 nil 能比较自己吗

    nil 是什么? 可以看看官方的描述,在 buildin/buildin.go 里: // nil is a predeclared identifier representing the zero ...