Twitter bootstrap Vue.js生产版本具有不同的生成CSS样式

在为生产构建项目（

build

）之后，某些元素具有不同的样式（在使用

service

时不存在）

详情：

我使用的是CoreUI Pro 3（Vue 2）和BootstrapVue 2.21.2，它们都使用bootstrap 4（但都是定制的）

问题是表单输入的有效或无效状态图标在生产中未对齐，但在开发中很好。因此

。表单控件
和
是有效的
例如，具有错误的
背景位置

在开发过程中，生成了两种等效的样式（使用了最上面的一种）

html:not（[dir=“rtl”]）。已验证。表单控件：有效，html:not（[dir=“rtl”]）。表单-control.is-valid{
背景位置：右中角（0.375em+0.1875rem）；
}
。已验证。表单控件：无效。已验证。表单控件：有效。表单控件。is-invalid。表单控件。is-valid{
背景位置：右计算中心（0.375em+0.1875rem）；
}

在生产中，还生成了两种样式，使用的是最上面的样式，这就是问题所在。强迫它使用第二个可以修复它

html:not（[dir=rtl]）。已验证form-control.is-valid，html:not（[dir=rtl]）。表单控件：valid{
背景位置：100%钙（.375em+.1875rem）；
}
.form-control.is-invalid、.form-control.is-valid、.was已验证。表单控件：无效，.was已验证。表单控件：有效{
背景位置：右calc（.375em+.1875rem）中心；
}

那么，有没有一个好的方法让它使用正确的风格或者找出问题的根源呢？
有好几种方法，但我不确定该先用哪一种

我尝试过更新所有各种sass加载程序和网页包，但没有任何改变。
我还尝试复制核心UI的导入文件并修改表单mixin的导入顺序，但没有任何帮助（我也不是sass专家）。移动
@mixin表单验证状态（$state，$color，$icon）
似乎没有什么帮助

my
styles.scss
中的特定导入顺序（相反的顺序不起作用）：

我知道可能会有很多相关的文件，但这些应该是一个好的开始。如果需要，可以提供更多详细信息

@import "~@coreui/coreui-pro/scss/coreui";
@import '~bootstrap-vue/src/index.scss';