首页 > 其他 > 详细

vue-elementUi项目打包后样式入坑

时间:2021-06-02 21:31:05      阅读:21      评论:0      收藏:0      [点我收藏+]
main.js
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from vue
import App from ./App
//先引入第三方组件
import ElementUI from element-ui
import element-ui/lib/theme-chalk/index.css
//后引入router
import router from ./router
import store from ./vuex/store
 
Vue.use(ElementUI)
Vue.config.productionTip = false
 
/* eslint-disable no-new */
new Vue({
 el: #app,
 router,
 store,
 components: { App },
 template: <App/>
})

找到了问题所在以及解决办法 代码如上:

main.js中的引入顺序决定了打包后css的顺序,组件内的样式没有生效可能是被第三方组件样式覆盖了,所以把第三方组件放在前面引入,router放在后面引入,就可以实现组件样式在第三方样式之后渲染。

但这样之解决了部分样式问题

页面中存在原生form样式和el-table中form样式页面中自定义的el-from-item样式打包覆盖导致部分样式失效

 

vue-elementUi项目打包后样式入坑

原文:https://www.cnblogs.com/liang715200/p/14842783.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!