ant-design-vue 按需加载

Posted 2023-03-16

参考技术A 1.创建js文件 src/components/lazy_antd.js 

2. 修改配置文件 babel.config.js增加插件配置

3.在main.js 中引入配置文件 src/components/lazy_antd.js

4. package.json引入依赖babel-plugin-import

"babel-plugin-import":"^1.13.0"

vue按需引入ant-design-vue报错解决方案

参考技术A 通过 vue-cli 创建的应用，安装了 ant-design-vue ,并通过 babel-plugin-import 进行按需引入。

错误如下：

安装完成后在vue页面中应用 Button 组件，启动项目报错如下：

运行 yarn add less less-loader -D 安装依赖后运行 yarn serve 报错如下，是由于 less-loader 版本过高导致的问题。

对 less-loader 进行降级处理：

在 vue.config.js 中进行如下配置：

完美解决：