Vue.js 可以导入 element-ui 和 Bootstrap 吗？答案

【问题标题】：Does Vue.js can import element-ui and Boostrap?Vue.js 可以导入 element-ui 和 Bootstrap 吗？
【发布时间】：2017-12-01 04:09:19
【问题描述】：

我已经导入了 element-ui 组件，但我可能需要一些常见的样式，例如 reset.css 和 Boostrap 中的其他样式。

他们可以在一个项目中同时退出而不冲突吗？

【问题讨论】：

【解决方案1】：

不，你不能。大多数情况下 element-ui 用 class 改变样式，但是 Bootstrap 用 class 和 HTML 标签改变样式，这是矛盾的。

例如，您可以在 Bootstrap 中找到以下代码：

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
}

在 element-ui 中有一个reset.css 定义如下：

h1,h2,h3,h4,h5,h6 {
    color:#1f2d3d;
    font-weight:inherit
}

所以你不能在一个项目中同时使用 Bootstrap 和 element-ui 而不冲突。

【讨论】：

如果我想要Bootstrap的基本风格以及element-ui的ui组件怎么办？
@junlin 为什么？如果你想使用 bootstrap 作为 Vue 组件，你可以试试 bootstrap-vue bootstrap-vue.js.org 。
我使用带有元素 ui 的 bootstrap 4 reboot.scss，现在一切正常
@Shaci 请您添加更多详细信息。你是怎么做到的？你的 main.js。