自定义配置Webpack和Babel配置

在使用ant-design-vue的包时样式是能够生效的可是若是我须要用到less文件时会报一个异常javascript

固然这个异常其实很清晰的说明了什么问题看错误信息里面有issues地址,看来问题不止咱们碰见了能够找到地址访问看看别人怎么说的我已经找出来了vue

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

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

一、下降less版本到3.0如下(此办法不友好,不建议使用)git

二、开启javascript,配置lessl-oadergithub

接下来咱们要使用webpack文件来配置下,新建vue.config.js相关说明能够参考官网地址以下web

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

从新启动下npm run serve  就已经解决了less配置问题浏览器

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

呢。

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

 

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

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

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

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

相关文章
相关标签/搜索