一逮光、問題描述
在使用Electron-vue搭配使用Element-ui的時候, 在使用Table表格的時候, 會出現(xiàn)頁面一片空白, 使用F12進(jìn)行審查元素的時候,表格的高度為0,而下面的tbody下面也是只是渲染了幾個tr空標(biāo)簽，而自己也是找了好久的問題，最終才發(fā)現(xiàn)問題所在桃纯。
也是很感謝這篇文章的博主https://blog.csdn.net/qq_17285877/article/details/96095936#_6下面是他對問題的出現(xiàn)的解釋
.electron-vue/webpack.renderer.config.js
針對 electron 的 renderer 進(jìn)程渣慕。此配置用來處理你的 Vue 應(yīng)用程序竿奏，
因此它包含 vue-loader 和許多其他可在官方 vuejs-templates/webpack 樣板中找到的配置。
白名單里的外部組件
一個關(guān)于此配置的重要的事情是钩骇，你可以將特定的模塊列入白名單，而不是把它視為 webpack 的 externals铝量。
并沒有很多情況需要這個功能倘屹，但在某些情況下，對于提供原始的 *.vue 組件的 Vue UI 庫慢叨，他們需要被列入白名單纽匙，
以至于 vue-loader 能夠編譯它們。另一個使用情況是使用 webpack 的 alias拍谐，
例如設(shè)置 vue 來導(dǎo)入完整的 編譯+運(yùn)行環(huán)境 的構(gòu)建烛缔。因此，vue 已經(jīng)在白名單中了轩拨。
二践瓷、解決問題
- 1.在項(xiàng)目的根目錄下再到
.electron-vue/webpack.renderer.config.js
webpack.renderer.config.js文件 - 2.打開
/webpack.renderer.config.js文件搜索whiteListedModules
//let whiteListedModules = ['vue']
//將這行修改為下面的的內(nèi)容
let whiteListedModules = ['vue', 'element-ui']
修改內(nèi)容
- 3.按F5進(jìn)行重載或者退出調(diào)試模式運(yùn)行
npm run dev重新打開就可以看到表格可以正常顯示了
正常顯示
程序報錯不可怕， 可怕的是沒有報錯亡蓉，卻沒有出現(xiàn)預(yù)期的效果
