同事檢出我的項目,在 roadhog build 編譯時,出現問題:
Module not found: Error: Can't resolve '@babel/runtime/helpers/esm/extends' in '/Users/everlose/workspace/scnode/msgcenter-sms/node_modules/history/esm'
根據下面的 ls 命令,我們能看到 history 目錄的確不存在與項目跟路徑,'/Users/everlose/workspace/scnode/msgcenter-sms/node_modules/history/esm'。
$ npm ls history
msgcenter-sms@1.7.10 /Users/everlose/workspace/scnode/msgcenter-sms
├─┬ dva@2.4.1
│ ├── history@4.6.3 deduped
│ ├─┬ react-router-dom@4.3.1
│ │ ├── history@4.9.0
│ │ └─┬ react-router@4.3.1
│ │ └── history@4.9.0
│ └─┬ react-router-redux@5.0.0-alpha.9
│ └── history@4.9.0
找到 github 上的 history 模塊代碼,翻到 4.9.0 發現它所依賴 babel 的版本的確變為了 7,而項目主 babel 版本還是6。猜測可能是 babel 主版本的影響。
查看其 4.7.2 及之前還是使用 babel 6 的。故而解決方法就是
$ npm install history@4.7.2 --save
$ rm -rf node_modules
$ npm install
$ npm ls history
msgcenter-sms@1.7.10 /Users/everlose/workspace/scnode/msgcenter-sms
├─┬ dva@2.4.1
│ ├── history@4.7.2 deduped
│ ├─┬ react-router-dom@4.3.1
│ │ ├── history@4.7.2 deduped
│ │ └─┬ react-router@4.3.1
│ │ └── history@4.7.2 deduped
│ └─┬ react-router-redux@5.0.0-alpha.9
│ └── history@4.7.2 deduped
└── history@4.7.2
再編譯時正常
$ npm run build
> msgcenter-sms@1.7.10 build /Users/everlose/workspace/scnode/msgcenter-sms
> roadhog build
Build completed in 33.632s
Compiled successfully.
File sizes after gzip:
681.58 KB public/index.657ff4cf.js
37.33 KB public/index.424c8126.css
心得
像這樣大的更新,依賴版本整個換了,那個 history 依賴包不應該只是升級中間版本的。這些依賴包簡直和無限套娃一樣,我都不知道什么時候用到了,真的是坑人。