关于vue项目样式优先级问题

问题遇到的现象和发生背景

关于vue项目是要element 使用message需要修改一些样式,在scss 的loader里写怎么尝试都不会生效 写在下面style就可以,有没有懂问题出在哪里

用代码块功能插入代码，请勿粘贴截图
<style lang="scss" scoped>
.MinWIDTH99 .el-message__content {
  display: inline-block !important;
  max-width: 310px !important;
  word-wrap: break-word !important;
  word-break: break-all !important;
}
style>
<style>
.MinWIDTH99 .el-message__content {
  display: inline-block !important;
  max-width: 310px !important;
  word-wrap: break-word !important;
  word-break: break-all !important;
}
我的解答思路和尝试过的方法

写在第一个scss里样式不会生效,但是下面style正常 是因为引入顺序问题吗?

style 不加 scoped 是全局的
加上 scoped 就只在当前组件生效

在全局生效是因为你那个弹窗在当前组件之外 。f12看看就知道了

加一个::v-deep呢

不是引入顺序，你使用了作用域插槽，直接修改不到组件的样式。
改成.MinWIDTH99 /deep/.el-message__content应该就行了

可参考文章：https://blog.csdn.net/sinat_17775997/article/details/83416617
主要是由于scoped的使用使得样式生成了个唯一的code