下载 ui库 yarn add ant-design-vue 默认是全局引入,打包后体积很大, 非常影响首屏加载速度, 按需加载 下载按需加载的插件;推荐使用cnpm cnpm install babel-plugin-import --save-dev 下载在开发环境中 在项目的根目录下创建 babel.config.js module.exports = { presets: [ '@vue/cli-plugin-babel/preset' ], plugins: [ ["import&qu

很多同学说AgileConfig的UI实在是太丑了.我想想也是的,本来这个项目是我自己使用的,一开始甚至连UI都没有,全靠手动在数据库里修改数据.后来加上了UI也是使用了老掉牙的bootstrap3做为基础样式.前台框架也是使用了angularjs,同样是老掉牙的东西.过年期间终于下决心翻新AgileConfig的前端UI.最后选择的前端UI框架为AntDesign Pro + React.至于为啥选Ant-Design Pro是因为他好看,而且流行,选择React是因为VUE跟Angular我

本篇带你使用 AntDesign 组件库为我们的系统换上产品级的UI! 安装组件库 在项目目录下执行:npm i antd@3.3.0 -S 或 yarn add antd 安装组件包 执行:npm i babel-plugin-import -D 安装一个babel插件用于做组件的按需加载(否则项目会打包整个组件库,非常大) 根目录下新建.roadhogrc文件(别忘了前面的点,这是roadhog工具的配置文件,下面的代码用于加载上一个命令安装的import插件),写入: { "extraBa

react-leaflet的github地址:https://github.com/PaulLeCam/react-leaflet react-leaflet-markercluster点聚合github地址  :https://github.com/YUzhva/react-leaflet-markercluster 本篇案例github地址:https://github.com/GugaLiz/ant-design-react-ProDemo 一.react-leaflet显示多个marke

react项目中ant-design按需加载,使用react-app-rewired的时候报错 运行npm start或者yarn start报如下错误: TypeError: injectBabelPlugin is not a function 原因好像说是react-scripts 升级到 2.1.2 以后破坏了 react-app-rewired 解决方法,对react-scripts进行降级处理 npm install react-app-rewired@2.0.2-next.0 成功

async-validator 是一个表单异步校验库,阿里旗下的 Ant-design 和 Element 组件库中的表单验证使用的都是 async-validator ,目前版本已更新到 4.0.7 ,下载量达到 1,067,202次,不仅支持 js ,同时也可支持 typeScript .是一个功能超级强大的库,有兴趣的一起来了解了解. async-validator 官网地址:https://www.npmjs.com/package/async-validator async-valid

首先确认安装了node环境,Node >= 6. 如果对react 及 ant-design 一无所知,建议去阅读下api文档,react 可以在 codePen 在线练习. react Api中文文档     ant-design 中文文档 本人也是第一次接触react,对本教程如疑问,欢迎评论 或 发送至 15521285778@163.com 交流 1,全局安装Create React App , 创建项目 Create React App 是开始构建新的 React 单页应用程序的最佳方

当我们准备好 Qt Creator 的源代码之后,首先进入到它的目录,来看一下它的源代码目录有什么奥秘. 这里一共有 9 个文件夹和 9 个文件.我们来一一看看它们都是干什么用的. .git: 版本控制 git 的隐藏目录,这与 Qt Creator 代码没有关系. bin: 生成 Linux 平台 shell 脚本. dist: 安装文件配置信息和版本更新记录. doc: 生成 doxygen 文档的配置文件. qbs: QBS 配置文件.QBS,即 Qt Build Suite,是一种跨平台

京东零售开源项目 NutUI 是一套京东风格的轻量级移动端 Vue 组件库,是开发和服务于移动 Web 界面的企业级产品.经过长时间的开发与打磨,NutUI 3.0 终于要和大家见面了!3.0 版本在技术和视觉方面都做出了较大改进,让组件看起来更绚丽,用起来更舒服. 源码抢先看:https://github.com/jdf2e/nutui 技术看点: 1. 拥抱 Vue3 引入 Vue3 新特性 Composition API.Teleport.Emits 等 破坏性变更,全面升级 采用组合式

京东零售开源项目 NutUI 是一套京东风格的轻量级移动端 Vue 组件库,是开发和服务于移动 Web 界面的企业级产品.经过长时间的开发与打磨,NutUI 3.0 终于和大家见面了!3.0 版本在技术和视觉方面都做出了较大改进,让组件看起来更绚丽,用起来更舒服. 源码抢先看:https://github.com/jdf2e/nutui 3.0官网:https://nutui.jd.com/3x 全新改变 技术看点 拥抱 Vue3 引入Vue3新特性 Composition API.Telepo

源码抢先看: https://github.com/jdf2e/nutui NutUI 3.0 官网:https://nutui.jd.com/3x/#/ 小程序多端适配 设计初衷 在跨端小程序的开发过程中,我们发现没有合适的组件库可以使用,尤其在做电商商城类场景的业务时,没有符合京东 App 规范的组件库为我们的小程序项目提供支持.为了填补这一空白,同时让 NutUI 组件库能够为更多的开发者带来便利,我们决定在 NutUI 3.0 中 增加小程序多端适配的能力. 如何适配 Taro 在小程序

从Vue3发布以来,我就一直对其非常感兴趣,就一直想着将其投入公司的生产中,但是开始考虑到很多不确定性就暂时对一些很小的功能进行一些尝试:慢慢的发现组合式Api的形式非常适合开发(个人感觉),尤其是Vue3.2推出了setup语法糖后直呼真香.后面公司的新项目几乎全部采用了Vue3了.使用Vue3开发也将近大半年了,所以写了这篇文章对Vue2和Vue3做了一个对比总结,一是为了对这段时间使用Vue3开发做些记录,二是为了帮助更多的小伙伴更快的上手Vue3. 本篇文章主要采用选项式Api,组合式A

引入antdesign中Carousel走马灯时遇到问题? Uncaught Error: Element ref was specified as a string (slick) but no owner was set. You may have multiple copies of React loaded. (details: https://fb.me/react-refs-must-have-owner). at invariant (invariant.js:) at coerc

逆波兰式,也叫后缀表达式 技巧:为简化代码,引入一个不存在的运算符#,优先级最低.置于堆栈底部 class Stack(object): '''堆栈''' def __init__(self): self._stack = [] def pop(self): return self._stack.pop() def push(self, x): self._stack.append(x) 一.表达式无括号 def solve(bds): '''不带括号,引入#运算符''' pro = dict(

我拍个砖,通常标称自己文章完美解决何种问题的,往往就是解决不了任何问题! 众所周知,JSPDF是一个开源的,易用的,但是对中文支持非常差的PDF库. 下面,我教大家,如何在pdf中使用思源黑体.思源黑体是开源字体.思源黑体具有很广泛使用性,实用性,也是规避字体版权风险的重要选择!请严格按照我说的做! 1.准备思源黑体的ttf文件,不要用otf文件,如下 https://github.com/be5invis/source-han-sans-ttf/releases . 我们挑其中的SourceH

react样式模块化的"omit -loader"坑 众所周知 react样式的模块化(css modules) 是自己模块中写自己的css,与其他模块互补影响,解决了命名冲突和全局污染的问题. 在使用css modules时,需要先配webpack.config  但是在配的时候,出现了这样的问题(前提是已经加载css-loader和style-loader) 在这里我的css-loader是0.28.7 style-loader是0.19.0 看看自己的package文件的load

AgileConfig的UI使用react重写快完成了.上次搞定了基于jwt的登录模式(AntDesign Pro + .NET Core 实现基于JWT的登录认证),但是还有点问题.现在使用react重写后,agileconfig成了个确确实实的前后端分离项目.那么其实部署的话要分2个站点部署,把前端build完的静态内容部署在一个网站,把server端也部署在一个站点.然后修改前端的baseURL让spa的api请求都指向server的网站. 这样做也不是不行,但是这不符合AgileConf

天命不足畏,祖宗不足法. --王安石 前言 本文并非标题党,而是实实在在的硬核文章,如果有想要学习Vue3的网友,可以大致的浏览一下本文,总体来说本篇博客涵盖了Vue3中绝大部分内容,包含常用的CompositionAPI(组合式API).其它CompositionAPI以及一些新的特性:Fragment.Teleport.Suspense.provide和inject. 项目搭建 既然是学习Vue3,那么首先应该需要的是如何初始化项目,在这里提供了两种方式供大家参考 方式一:vue-cli脚手

这是基础部分的最后一章,内容比较简单,算是为基础部分来个HappyEnding.我们分三个部分来学习: 表单输入绑定 Vue的表单验证:VeeValidate Blazor的表单验证:EditForm 一.表单输入绑定 表单输入主要涉及前面章节的双向绑定,但不需要我们自定义,直接使用就行.如果已经掌握了"1.6章节双向绑定",那这部分的知识点简直"洒洒水".Vue的v-model指令,为所有原生的HTML组件做了一些特殊处理,不仅支持双向绑定,也支持check或ra

为什么会有这样一篇文章?因为网上的教程/示例只说了怎么做,没有系统详细的介绍引入这些依赖.为什么要这样配置,甚至有些文章还是错的!迫于技术洁癖,我希望更多的开发小伙伴能够真正的理解一个项目搭建各个方面的细节,做到面对对于工程出现的错误能够做到有把握. 最近使用阿里低开引擎的时候,想要封装一套组件库作为物料给低开引擎引入.根据低开引擎的物料封层模式,我的诉求是做一套组件库,并且将该组件库以umd方式生成.当然,从零开始开发组件库也是一个比较耗时耗力的事情,所以我想到将antd组件封装,于是催生出了

自上月从上海结束工作回来 在家闲来无事 想写点东西打发时间 也顺便学习学习新的技术.偶然发现了 pinia 据说比vuex好用些 所以便搭了个demo尝试着用了下 感觉确实不错,于是便有了这篇随笔. 那么废话不多说 直接开始吧.(附pinia官网地址:https://pinia.web3doc.top/) 1.安装 yarn add pinia # 或者使用 npm npm install pinia 2.项目中引入 vue2引入方法(直接复制官网的) import { createPinia,