【前端】vue项目同时引入elementUI和ant-design后导致打包失败的
【前端】vue项目同时引入elementUI和ant-design后,导致打包失败的解决...
VUE同时引入elementUI和ant-design后，可正常运行，但会导致打包失败，且在启动时会输出错误语句。无论组件库是否按需引入，在打包或启动时都会报以下错误：Subsequent property declarations must have the same type. Property ‘confirm’must be of type ‘modalOptios: ModalOptions) => ModalConfi后面会介绍。
创建每一个组件的时候都给根元素类名。在写组件独有样式的时候加上这个根元元素，在创建每一个组件的时候都给根元素一个独立的类名，或者id。
VUE同时引入elementUI和ant-design后，可正常运行，但会导致打包失败，且在启动时会输出错误语句。无论组件库是否按需引入，在打包或启动时都会报以下错误：Subsequent property declarations must have the same type. Property ‘confirm’must be of type ‘modalOptios: ModalOptions) => ModalConfi后面会介绍。
创建每一个组件的时候都给根元素类名。在写组件独有样式的时候加上这个根元元素，在创建每一个组件的时候都给根元素一个独立的类名，或者id。
我的解决办法：1、把不常改变的库放到index.html中，通过cdn引入，比如下面这样：然后找到build/webpack.base.conf.js文件，在module.exports = { } 中添加以下代码externals: { 'vue': 'Vue', 'vue-router': 'VueRouter', 'element-ui': 'ELEMENT', },这样webpack就不会把vue.js, vue-说完了。
通过vue-cli 创建的应用，安装了ant-design-vue ,并通过babel-plugin-import 进行按需引入。错误如下：安装完成后在vue页面中应用Button 组件，启动项目报错如下：运行yarn add less less-loader -D 安装依赖后运行yarn serve 报错如下，是由于less-loader 版本过高导致的问题。对less-loader 等我继续说。
vue+webpack+element打包后线上样式不一致 -
我的项目是因为之前多人开发，不严谨导致，css到处乱引用产生的错误。具体原因为在main.js引入了element的样式，然后到单独的组件中，又引入了一遍。将所有组件中引入的（因为通过@import引入或者import引入，作用域是全局）面向全局的样式，都删掉，然后统一在main.js中引入。这样全局的顺序都在main.js 中等我继续说。
为了解决公司内部多个项目中常见的列表、详情和弹框等重复页面问题，我们开发并维护了一个基于Vue.js 2.x和ant-design-vue的中后台前端脚手架。这款脚手架已成功应用于5个以上的系统，未来将持续优化，现提供在线效果预览。这个脚手架旨在快速构建一致性风格的中后台系统前端，兼容性良好。它包含一套详细是什么。
elementtableexpand打包后失效 -
检查依赖版本，检查打包配置。1、检查依赖版本：确保项目依赖的elementui版本与vuejs版本兼容，依赖版本不匹配，会导致某些功能无法正常工作。2、检查打包配置：使用的是webpack或者别的打包工具，需要检查打包配置。有时候，打包工具的配置会导致某些功能或者模块无法正常加载。
Ant Design Vue 官方提供中文文档：Ant-Design-Vue 项目在GitHub 上的地址：Ant-Design-Vue 项目Star 数：16.9k 微信交流群：前端攻城狮（点击加入）Ant Design Vue 的特性包括： 基于企业级中后台产品的交互语言和视觉风格提炼而成。 提供开箱即用的高质量Vue 组件。 与Ant Design of 还有呢？
解决elemnt-ui安装后运行报错的问题 -
新建了Vue2.x项目并引入element-ui后执行npm run dev发现编译报错找不到依赖：This dependency was not found:其实就是'element-ui/lib/theme-default/index.css'这个文件不存在在安装element-ui组件时默认安装最新版本2.x，而我们的引入element-ui：theme-default文件夹其实是Element-ui 1.x 的目录后面会介绍。
修改webpack.prod.conf.js 文件效果如下：资源与依赖包的控制通过上面进度可以看到，打包过程中，卡顿在压缩的地方过长，当项目越来越臃肿的时候，我们要需要对项目静态资源以及依赖包进行整理，项目里面使用ElementUI 和Echarts 都是全部引用挂在Vue.prototype 上，现都改为按需引用。预处理各种还有呢？