在使用ant-design-vue的包时样式是可以生效的但是如果我需要用到less文件时会报一个异常

当然这个异常其实很清晰的说明了什么问题看错误信息里面有issues地址，看来问题不止我们遇见了可以找到地址访问看看别人怎么说的我已经找出来了

https://github.com/ant-design/ant-motion/issues/44

根据上面链接反应出要解决此问题有两种方案

1、降低less版本到3.0以下（此办法不友好，不建议使用）

2、开启javascript，配置lessl-oader

接下来我们要使用webpack文件来配置下，新建vue.config.js相关说明可以参考官网地址如下

https://cli.vuejs.org/zh/config/

重新启动下npm run serve  就已经解决了less配置问题

此时我们看下NetWork里面加载的文件，发现我们加载的库被全局加载进来了总共有12.8M的包，这样肯定是不行肯定会想方法优化下，能不能按需加载

呢。

此时找到了babel官方网站的确有配置参数可以解决  https://vue.ant.design/docs/vue/introduce-cn/

按照官网配置下配置完发现控制台和浏览器还有个报错

此时直接安装一下babel依赖就好了

npm i --save-dev babel-plugin-import

完成就重新运行下此时app.js就只有3.9M了，此时就解决了按需加载的问题

自定义配置Webpack和Babel配置的更多相关文章

  1. webpack中babel配置 --- runtime-transform和babel-pollfill

    webpack - babel配置 babel是一个javascript编译器,是前端开发中的一个利器.它突破了浏览器实现es标准的限制,使我们在开发中可以使用最新的javascript语法. 通过构 ...

  2. react+webpack基础学习配置

    最近学习react,公司的项目是使用create-react-app来搭建的,而我想重新使用node+mysql+react来搭建一个新的博客. 今天尝试从零开始搭建一个webpack+react项目 ...

  3. webpack window下配置的hello world

    峰回路转 一区九折 先看效果:(此效果是webpack执行完之后会生成build文件夹已经它下面的index.html,点击index.html就是下图的效果)

  4. 笔记：配置 webpack dev server

    笔记:配置 webpack dev server 安装 webpack-dev-server 组件 配置 webpack.config.js 配置 增加 html-webpack-plugin 组件 ...

  5. webpack，Babel，babel-loader的关系

    本文将要介绍 webpack,Babel,babel-loader 的关系.理清楚他们各自做了什么事情. 通常我们新建一个项目,会先配置webpack,然后配置babel:babel是一个编译工具,实 ...

  6. webpack使用babel

    几个月没用webpack都忘了好多了. webpack构建前端,使用时除了entry/output,就是plugins和module.loaders,还有本地测试的devServer. npm ins ...

  7. webpack.config.js配置遇到Error: Cannot find module '@babel/core'&&Cannot find module '@babel/plugin-transform-react-jsx' 问题

    下文是网上找到的方法,是因为版本冲突的原因,参照后安装7版本解决 cnpm install -D babel-loader@ babel-core babel-preset-env 一. 问题描述 在 ...

  8. 配置React的Babel 6和Webpack 2环境

    Facebook的一帮子工程师在忙碌之余开发除了一套前段UI框架React.这个框架最大的有点就在于让UI的开发都基于组件,这样View都是根据props和state变化的. 项目地址:https:/ ...

  9. babel 7.x 结合 webpack 4.x 配置

    今天在学习webpack的使用的时候,由于学习的教程是2018年初的,使用的是 webpack 3.x 和 babel 6.x ,然后学习的过程中出现的了很多问题. 解决问题之后,总结一下新的 bab ...

随机推荐

  1. $.store.book[?(@.category=='fiction')].category

    表达式1 $.store.book[?(@.category=='fiction')].category json source { "store": { "book&q ...

  2. POJ1016 Numbers That Count

    题目来源:http://poj.org/problem?id=1016 题目大意: 对一个非负整数定义一种运算(inventory):数这个数中各个数字出现的次数,然后按顺序记录下来.比如“55531 ...

  3. element-ui国际化探索（大型项目适用）

    配置好了,自己感觉是比较简单的,就是有一点点繁琐,加油吧. 由于保密,无法拿出项目,故写了一个小demo,记录一下,适用于大型项目: 项目中需要自定义切换中/英文(国际化),基于vue.js,结合vu ...

  4. screen命令常用参数使用

    screen简要说明 screen 会话命令可以保持本地和服务器断开后,程序继续在服务器上运行,并且运行结束后,输出最后的结果.功能结果相当于 nohup command &,但是功能远比no ...

  5. MD5-UTF8-大写加密

    private string GetMD5Hash(string str) { string md5Str = ""; byte[] buffer = Encoding.UTF8. ...

  6. C# AD 验证登陆

    using System.DirectoryServices; using System.DirectoryServices.AccountManagement; using (DirectoryEn ...

  7. 使用jdk的xjc命令由schema文件生成相应的实体类

    xjc D:\operate-process.xsd -d D:\workspace\wmsc\src\main\java -p com.yd.wmsc.util operate-process.xs ...

  8. Java定时任务的几种实现方式

    java Timer比较具体的实现实例 https://www.cnblogs.com/0201zcr/p/4703061.html 转载大神 的 https://blog.csdn.net/kegu ...

  9. 带图片的word快速插入到博客中

    最近在博客中写文章的时候,最烦的就是将word文档整体传到博客中,不能一次把图片粘贴上去,再次去添加图片的时候要截图还要找对位置才可上传,偶尔的机会在网上看到有人这么处理,挺好用的,这里我也做个备注. ...

  10. 如何自动更新SVN项目

    在桌面新建“SVN Update.bat”文件,把下面的命令复制到该文件中,保存并退出,然后使用windows的“任务计划”功能,就可以实现定时自动更新SVN目录. 按此批处理文件的方法执行,一次可自 ...