Webpack alias与tsconfig paths问题：Module not found错误解决

最近遇到一个Module not found: Error: Can't resolve问题

这个问题的背景是webpack+react+typescript在引用各种包的路径的时候，../../太多了，想简化路径，于是小白的我一开始上来去改tsconfig，改完了还是报Module not found: Error: Can't resolve，于是百度了一番。

网上通篇都会告诉你，tsconfig的path映射改完了，你也要改webpage的alias，有的还会提示你，babel里面还有path映射呢，然后立马就眼晕了，不知所措了。

百度另外一番景象会给你解题思路，你你要用代替@babel/preset-typescript，总的意思就是要你用工具来自动替换path，达到上面的路径映射一致。

看到这里还是各种不明白。直到我偶然间发现其实说了那么多，最最最简单的解决这个问题的办法就是分别在webpack和tsconfig里面更改别名，其实就是在做路径映射的事情，比上面种种都要简单许多倍。

第一步tsconfig中加入：

第二步webpack config中对应改上：

引用的时候，只要@/就代表是绝对路径src/xxxx，就大功告成了。