比如我們可以看到一些css文件中有這樣的代碼：
@import '~antd/dist/antd.css';
...
那么，這個 ~ 起什么作用呢？
首先，我們來看一下URL轉換規則
1、如果URL是一個絕對路徑（例如 /images/foo.png），它將會保留不變。
2、如果URL以 . 開頭，它會作為一個相對模塊請求被解析且基於你的文件系統中的目錄結構進行解析。
3、如果URL以 ~ 開頭，其后任何的內容都會作為一個模塊請求被解析。這意味着你甚至可以引用node模塊中的資源：
<img src="~some-npm-package/foo.png" />
4、如果URL以 @ 開頭，它也會作為一個模塊請求被解析。它的用處在於可以在webpack中設置別名。
其實和import，require沒區別，只是這種方式不能寫到css或者html里面，就寫成了~ (css /less/ sass沒有用於導入相關文件的特殊語法,
所以這里添加的~實際上是為了告訴webpack這里是從根目錄開始尋找，而不是相對目錄。)
Webpack 會將以 ~ 符號作為前綴的路徑視作依賴模塊而去解析