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