element-ui overrides why css, works normally in development mode npm run dev, does not work after
npm run build, and all styles become the default.
effect display:
Code in style of APP.vue
<style>
/* */
.el-dialog {
background: rgb(77, 73, 65);
}
.el-dialog__title {
color: -sharpcfccb9
}
.el-dialog__body {
padding: 16px 10px;
color: -sharpcec9c2;
line-height: 20px;
font-size: 14px
}
</style>has been pulled out of the app.css, the unsuccessful style is obviously a lack of priority, so the most likely problem is that the style you set has been overridden by the native css of element.
add an import
Thank you very much for your answers. Here is a positive solution published by kedaya:
The style indev is not overwritten. Dev adds your element style through the js append
style tag, while after build your element base style is introduced through link's css.
the root cause of the phenomenon I have described is the problem of priority coverage caused by the above reasons.
the solution can be solved with "rabbit likes to eat pear" and "toBeTheLight", which has been tested.
Previous: How css3 Animation is compatible with ie9
Next: Vue uses data-driven thought to achieve operation dom?