zoukankan      html  css  js  c++  java
  • vue+elementui项目打包后样式变化问题

    博主刚刚解决了index.html空白问题,刚打开项目页面又发现了样式出现了大问题,样式与开发版本有很大不同,有些样式没有生效。利用搜索引擎,找到了问题所在以及解决办法:
    main.js中的引入顺序决定了打包后css的顺序,组件内的样式没有生效可能是被第三方组件样式覆盖了,所以把第三方组件放在前面引入,router放在后面引入,就可以实现组件样式在第三方样式之后渲染。代码如下:

    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/>'
    })

    ———————————————— 

    版权声明:本文为CSDN博主「Arlisol」的原创文章。
    原文链接:https://blog.csdn.net/Dg_Zing/article/details/87907796

  • 相关阅读:
    Luogu P3371 线段树1
    8-16模拟赛
    Luogu P1313 计算系数
    Luogu P1525 关押罪犯
    Luogu P1040 加分二叉树
    Luogu P1018 乘积最大
    Luogu P1541 乌龟棋
    BST,Splay平衡树学习笔记
    常见的逻辑错误
    行为认知疗法——十大认知错误
  • 原文地址:https://www.cnblogs.com/azhqiang/p/11387553.html
Copyright © 2011-2022 走看看