前提
最近剛接手同事的vue+element項目，就碰到了一個困擾了許久的bug，bug如標題所示，報錯“ Cannot read property ‘reduce’ of null" 。 google了許久，發現跟這相關的解決手段很少，所幸最後還是解決了，這裏簡單記錄下。
問題分析
問題的由來是：同事在測試環境用npm run build:test打包成的dist目錄，可以正常運行無異常，而當我通過git pull拉下代碼後再本地npm run dev運行起來，其他功能正常運行，唯獨在一個頁面需要點擊任務詳情的時候報了上述錯誤！
問題分析：
確認同事本地代碼和線上代碼一致–>非代碼不一致導致的異常
懷疑npm install時的node_modules出現了異常，於是刪除對應的node_modules、刪除package-lock.json重新install，仍無效–>非包安裝異常
懷疑npm的版本不一致導致的，我的是6.4，同事的是6.9，卸載後重新安裝6.9的，仍無效–>非npm版本不一致導致的異常
排查始終圍繞着同事的能運行，而我的不能運行，考慮到許多，比如是不是.gitignore上的部分導致不一致，比如同事本地環境的一些特定依賴包等等，最後仍不得其解，所幸在google的時候發現的一個issue很像，相關鏈接位於：https://github.com/xuliangzhan/vue-element-extends/issues/66。
這個issue解決：TypeError: Cannot read property ‘key’ of null"，和’reduce’ of null"基本是很相像的，而由key of null引起的問題就是vue-element-extends的版本和vue本身的版本不一致導致。但我的vue項目並沒有引用到element-extends這個包，不過倒是讓我發現了element-ui是2.8版本，而vue是2.5版本。
問題解決
根據上述的鏈接大神所說，匹配規則如下：
vue-element-extends 1.0.x 對應 vue^2.5+ 、element-ui^2.0~2.6
vue-element-extends 1.2.x 對應 vue^2.6+ 、element-ui^2.0+
雖然我沒有使用到vue-element-extends，但我把element-ui從2.8改到2.4後問題就成功解決了，所以vue版本和element-ui整個版本匹配基本可以參照如上
總結
後續碰到’reduce’/key of null，可以多考慮是否爲vue和element版本不一致所導致的~
轉載地址：sandwu