{oc.tech.notes} 技術誌
技術誌記錄學習或專案執行當下遇到的問題及解決方案,方便日後翻查,益人益己!
2024/03/16
[Vite] 前端開發模擬 API 的好物 Mock Service Worker (MSW)
markdown
### 前言
網站開發階段,常常會遇到前端開發時需要模擬呼叫 API 的情境。
用 json-server 來起一個服務是方便測試,但是跟網站是分開的 server,可能會因為忘記把服務開啟而呼叫失敗。
在不用後端介入的情境下,前端用 Vite 整合 Mock Service Worker (MSW) 模擬客製回應是個不錯的選擇。
2024/02/10
[Visual Studio 2022] v17.8 新功能 - 字串搜尋取代時保留原始大小寫格式
markdown
### 前言
在過去要搜尋文字取代時,不同的大小寫可能要分批做幾次取代,以保留原始的英文字母大小寫。
在 VS2022 v17.8 的新功能就可以一次辦到囉!多省做幾次取代步驟的時間。
### 環境
- Visual Studio 2022 v17.8.6
### 實作
原始的文字內容如下
用快速鍵 Ctrl+H 做取代動作,點選 AB 的按鈕做 Case 保留
第一組: 只取代 demo
第二組: 取代 demohttp
是不是很方便呀?
2024/02/09
[RESTful API] 如何在 Visual Studio 2022 及 VS Code 使用 .http 檔案文件化測試 API 執行結果
markdown
### 前言
通常在測試 API 的工具中,Postman 或 Insomnia 都是很方便的 API 測試圖形介面工具。
只是各工具有各自的保留文件格式,若能把測試 API 的資料文件化並做版控,又能夠減少散落在各處的翻查不易的問題。
因為 Visual Studio 2022 已支援能夠在 IDE 開啟 .http 文件,並直接可做測試看結果,而且功能齊全,文字檔案又能做版控。
但筆者不是只有 .NET 的專案,還有其他程式語言的專案,也會使用 Visual Studio Code 來撰寫,所以若能讓 .http 文件能跨專案跨工具來執行並管理就更棒了。
在本文中分別介紹在 Visual Studio 2022 及 Visual Studio Code 如何使用 .http 來執行測試 RESTful API。
[WSL] 如何在 Windows 11 安裝 WSL
markdown
趁著換新電腦,安裝主機開發環境,記錄一下安裝 WSL 的步驟 (Windows 11 之後的預設 WSL 版本已為 WSL 2)
### 準備
目標的作業系統為 Windows 11
先確認至 控制台 > 程式和功能 > 開啟或關閉 Windows 功能
勾選 "Windows 子系統 Linux 版" 以及 "虛擬機器平台",確定後並重新開機
2023/09/16
如何在 Windows 安裝及格式化新磁碟機
markdown
久違的硬體升級,終於把六年的老機給換新機,手動加了一條 2TB 的 SSD。記錄安裝及格式化新磁碟機的步驟。
### 磁碟管理
搜尋 "建立及格式化硬碟及磁碟分割"
1. 在 磁碟管理 介面會看到 "不明 未初始化" 的磁碟,這就是準備要進行配置的磁碟
2023/05/20
[EFCore] 執行 Update-Database Migration 時遇到連線資料庫發生憑證錯誤
markdown
### 開發環境
- Visual Studio 2022 v17.6
- ASP.NET Core MVC (.NET 6)
- Entity Framework Core 7.x
### 問題
在執行 Update-Database 的 Migration 指令時出現資料庫憑證錯誤的訊息,使得更新資料庫失敗。
錯誤訊息如下:
```
A connection was successfully established with the server, but then an error occurred during the login process. (provider: SSL Provider, error: 0 - 此憑證鏈結是由不受信任的授權單位發出的。)
```
在本機端開發第一次遇到連線字串需要憑證的問題,過往是連遠端資料庫才會有憑證要求,特此記錄一下。
### 解決方法
一種是在連線字串後加上 `Encrypt=False;` 不採用加密連線
另一種方式是主動信任 SQL Server 的憑證 `TrustServerCertificate=True;`
在本機開發階段連線不加密或是主動信任憑證是還好,在生產主機上連線就依正常加密及正確的憑證吧!
### 參考資料
- [使用 Microsoft.Data.SqlClient 連線資料庫發生憑證錯誤](https://blog.poychang.net/the-certificate-chain-was-issued-by-an-authority-that-is-not-trusted/)
- [MS Docs - Release notes for Microsoft.Data.SqlClient 4.0](https://docs.microsoft.com/en-us/sql/connect/ado-net/introduction-microsoft-data-sqlclient-namespace?view=sql-server-ver15#breaking-changes-in-40?WT.mc_id=DT-MVP-5002629)
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)
訂閱:
文章 (Atom)