在使用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. QPS,TPS,吞吐量,响应时间详解及关系

    并发数 并发数是指系统同时能处理的请求数量,这个也是反应了系统的负载能力 吞吐量吞吐量是指单位时间内系统能处理的请求数量,体现系统处理请求的能力,这是目前最常用的性能测试指标 响应时间RT(Respo ...

  2. POJ1013 Counterfeit Dollar

    题目来源:http://poj.org/problem?id=1013 题目大意:有12枚硬币,其中有一枚假币.所有钱币的外表都一样,所有真币的重量都一样,假币的重量与真币不同,但我们不知道假币的重量 ...

  3. LDAP--对某些AD属性值是字节数组byte[]情况的类型转换方法

    //BitConverter.ToBoolean((searchResult.Properties["mDBUseDefaults"][0] as byte[]), 0); row ...

  4. 我在B站学习 清华大学教授带你学习c++(进阶)构造函数

    B站av11459203的一系列视频,跳过了基础篇直接进入进阶,从此难度开始加大.这里做出一些笔记分享一下. 我是1.25速度看的..对应分P 37-38 构造函数的作用 将对象初始化为一个特定的初始 ...

  5. 多级联动的select框

    JS文件: ; (function($, w) { var LinkSelect = function(config) { var opt = { doms: config.doms || [], u ...

  6. Win10家庭版打不开gpedit.msc

    本文来源 : https://www.ithome.com/html/win10/324926.htm win10家庭版是不自带这个功能的 首先我们打开记事本,并输入以下内容(注意空格): @echo ...

  7. bzoj 3732: Network 树上两点边权最值

    http://www.lydsy.com/JudgeOnline/problem.php?id=3732 首先想到,要使得最长边最短,应该尽量走最短的边,在MST上. 然后像LCA那样倍增娶个最大值 ...

  8. CAST 变类型,如 SELECT CAST('12' AS int)

    select distinct CAST(value as signed) valueprice,CAST(value as signed) valueid from app_coupon

  9. SQL2008无法启动,报错"17051"解决方法

    SQL2008无法启动,这是错误日志: C:/Program Files/Microsoft SQL Server/MSSQL10_50.MSSQLSERVER/MSSQL/Log 2011-06-0 ...

  10. MapReduce的输入格式

    1. InputFormat接口 InputFormat接口包含了两个抽象方法:getSplits()和creatRecordReader().InputFormat决定了Hadoop如何对文件进行分 ...