2023/03/19
[TypeScript] 解決 Webpack v4 升級到 v5 遇到 tsc 編譯時出現 Cannot find name 'Map'
### 問題
繼上編解決在 webpack v4 的安全性相依成功升級後。接下的任務是進一步將 webpack 的版本由 v4 升到 v5。
升級前環境:
```json
"devDependencies": {
"@types/node": "^16.0.0",
"ts-loader": "^8.4.0",
"typescript": "^5.0.2",
"webpack": "^4.46.0",
"webpack-cli": "^4.10.0"
}
```
把 webpack 及 webpack-cli 升級到 5.x,並同步升級 ts-loader 至 9.x 版本
執行 tsc 時出現 Cannot find name 'Map' 的問題
### 解決方法
除了更新 webpack, webpack-cli, ts-loader 的版本外
也要一併更新 `@type/node` 的版本
```
npm install -D @types/node
```
修改 `tsconfig.json` 加上 typeRoots 的位置
```
"typeRoots": [
"node_modules/@types"
],
```
升級後環境:
```json
"devDependencies": {
"@types/node": "^16.18.16",
"ts-loader": "^9.4.2",
"typescript": "^5.0.2",
"webpack": "^5.76.2",
"webpack-cli": "^5.0.1"
},
```
### 後記
其實在這專案的底下還有一組是用 Typescript 2.x 的版本做編譯,但暫時未能同步升級,卻用不同的 Typescript 的版本,不特別指定會是以主目錄下的 `node_modules/@type` 為目標。所以兩個都直接指定各自的 typeRoots 就可以順利通過編譯。總算也把開發的相依套件版本全都升級完成。
### 參考連結
- [Typescript compiler: Cannot find name 'Map'](https://stackoverflow.com/questions/52468096/typescript-compiler-cannot-find-name-map)
2023/03/18
[npm] 解決 npm glob-parent 版本過舊的安全性問題
markdown
### 問題
最近在一個舊的專案採用 webpack 4.x 的版本,最近要修改檔案,要在能正常執行下,想要一併更新一下開發套件版本。
原本環境:
- typescript 3.9.5
- ts-loader 7.0.5
- webpack 4.43.0
- webpack-cli 4.9.1
執行 `npm audit fix` 之後,已修正不少套件相依版本,但仍有安全性相依版本的問題,即便依照指令再做一次 fix 的動作仍無法更新修正。
glob-parent <5.1.2
Severity: high
glob-parent before 5.1.2 vulnerable to Regular Expression Denial of Service in enclosure regex - https://github.com/advisories/GHSA-ww39-953v-wcq6
fix available via `npm audit fix`
node_modules/watchpack-chokidar2/node_modules/glob-parent
chokidar 1.0.0-rc1 - 2.1.8
Depends on vulnerable versions of glob-parent
node_modules/watchpack-chokidar2/node_modules/chokidar
watchpack-chokidar2 *
Depends on vulnerable versions of chokidar
node_modules/watchpack-chokidar2
watchpack 1.7.2 - 1.7.5
Depends on vulnerable versions of watchpack-chokidar2
node_modules/watchpack
webpack 4.44.0 - 4.46.0
Depends on vulnerable versions of watchpack
node_modules/webpack
由於 GitHub 的機器人找出這個安全性問題,而且風險值很高,雖然不更新時,可正確產出結果,但是總是有個風險在。
當然直接升級 webpack v5.x 後,此安全問題可以解決,但是在跑專案時會出錯,以暫時不升版的狀況下,該如何更新版本而不出錯才是當前要解決的問題。
程式開發者不能不知道的 GitHub Copilot
markdown
### 前言
GitHub 在 2021 六月時推出 AI 程式碼工具 Copilot。它可以幫助開發者在寫程式時提供自動完成程式建議。基於 OpenAI Codex 可即時在編輯器作用。相較於現在超及熱門的 ChatGPT,[GitHub Copilot](https://github.com/features/copilot) 是更適合開發人員使用的工具。然而 Microsoft 就在昨日還隆重介紹了 [Microsoft 365 Copilot](https://blogs.microsoft.com/blog/2023/03/16/introducing-microsoft-365-copilot-your-copilot-for-work/?WT.mc_id=DT-MVP-5002629),要把它融入日常工作流程中,現在完全不能忽視 Copilot 了呀~
首先還是先來把工具搭配 Copilot 搞定吧!