一、前言
最近我把項目進行了整體重構，將原先的vue和electron分為兩個工程文件夾的形式融合為了一個electron-vue工程文件，因為有很大的改動，特別是環境和相關配置方面與原先的工程有很大的不同，隨之而來就有很多坑，這篇文章要將的就是今天碰到的element-UI一個組件重構前顯示OK但重構之后顯示不OK的問題，詳情請繼續閱讀。
二、問題描述
在vue組件中，使用了Element的el-table組件，當重構了之后發現這個組件在相應頁面不顯示（高度為零），數據什么正常，語法OK，各種路徑也OK，控制台也沒報錯，我花了一個上午找原因…
三、問題解析
在重構之后（electron-vue融合流），項目根目錄文件夾下有一個.electron-vue文件夾，下邊放着幾個js配置文件（我的項目是6個js文件），具體的每個js配置文件詳情請參考electron官網描述（中文的，哈哈）。
另外我也瀏覽了Google，發現原來在vue中直接引入element的方式已經不能滿足融合流的要求啦。
請打開.electron-vue文件夾下的webpack.renderer.config.js配置文件，你會找到這樣一行代碼，竟然需要添加白名單！對的，你沒看錯（不明白什么是白名單的，請自行去問度娘）：
那么，vue都需要這樣做，是不是element-ui也學要同樣的操作才能正常使用呢，嘿嘿，答對了，So…
四、問題解決（附上代碼）
只需要將element-ui也添加進白名單就可以啦！
// 將vue模塊列為白名單
let whiteListedModules = ['vue', 'element-ui']
1
2
然后重新運行項目，再進相應頁面就會發現萬惡的el-table組件不顯示的問題已經完美解決。