在使用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. cve_2020_6507分析

    poc $ cat poc.js array = Array(0x40000).fill(1.1); args = Array(0x100 - 1).fill(array); args.push(Ar ...

  2. aspnetcore最最简单的接口权限认证

    五月一眨眼就过去,就当凑个数吧. 场景: 一个小小的项目,需要一个后台,就展示几个列表,连用户表.角色表等都不需要设计. 之前有写过identityserver4和jwt4的demo (exercis ...

  3. Redis系列14:使用List实现消息队列

    Redis系列1:深刻理解高性能Redis的本质 Redis系列2:数据持久化提高可用性 Redis系列3:高可用之主从架构 Redis系列4:高可用之Sentinel(哨兵模式) Redis系列5: ...

  4. 【AGC】云监控日志服务查询不到Logger日志相关问题2

    ​[关键字] AGC.云监控.日志服务 [问题描述] 之前有开发者反馈在使用AGC云监控,填写了Logger日志,但是在云监控的日志服务查不到的问题.具体如下所述: 云函数按要求写了Logger日志, ...

  5. AI隐私保护中的常见隐私隐私问题与解决方案

    目录 题目:<AI隐私保护中的常见隐私问题与解决方案> 引言 随着人工智能技术的快速发展,AI隐私保护也成为了一个备受关注的问题.由于AI技术的应用范围越来越广泛,例如语音识别.图像识别. ...

  6. 免杀系列之利用blockdlls和ACG保护恶意进程

    blockdlls Cobalt Strike 3.14版本以后添加了blockdlls功能,它将创建一个子进程并限定该子进程只能加载带有Microsoft签名的DLL. 这个功能可以阻止第三方安全软 ...

  7. google colab使用体验

    复现的TRSSL 的代码似乎是python3.8的,在本地跑电脑带不起来,即时把处理图形数改为1 但是colab用3.8不太好下载包, 因此直接上了3.9 除了一些库没有意外,遇到了一点小问题: Ca ...

  8. Rust 学习笔记:快速上手篇

    Rust 学习笔记:快速上手篇 这篇学习笔记将用于记录本人在快速上手 Rust 编程语言时所记录的学习心得与代码实例.为此,我会在本笔记库项目的Programming/LanguageStudy/目录 ...

  9. JSGRID loaddata显示超级多空行

    这个逼问题困扰了我两天了 作为一个主后端的程序员 初体验前端技术栈真的麻之又麻 以防万一 请先确认 是不是和我一个情况 如果是 请往下看 首先 我们需要念一段咒语 json是json string是s ...

  10. Git子模块使用说明

    介绍 前端不同应用存在公共的脚本或样式代码,为了避免重复开发,将公共的代码抽取出来,形成一个公共的 git 子模块,方便调用和维护. 软件架构 本仓库代码将作为 git 子模块,被引用到其他仓库中,不 ...