【前端】nodeJs 版本管理工具
前言在開發Node.js的過程中,我們經常會面臨版本管理的問題。不同的專案可能需要使用不同的Node.js版本,這時候我們可以使用一個稱為Node Version Manager(nvm)的工具來管理Node.js版本,輕鬆在不同的專案中切換所需的Node.js版本。
一、Node Version Manager (nvm)1-1 簡介Node Version Manager (nvm) 是一個功能強大的Node.js版本管理工具,它可以讓我們在同一台電腦上安裝並管理多個Node.js版本。這意味著你可以在不同的專案中使用不同的Node.js版本,而無需全局改變你的系統環境。
1-2 前置作業在開始使用nvm之前,請確保你已經安裝了Git。你可以在 Node Version Manager 的 GitHub 頁面 上找到相關資訊。
Github : Node Version Manager
如果你使用的是Linux系統,可以從 Node Version Manager 的 Linux Release 頁面 下載nvm。
Release (Linux) : Node Version ...
Angular (二) - component 與 router 介紹與實作
前言由於近期到公司使用Angular框架開發,本人使用次數不會超過10次,所以會有些許不正確的地方,如果有錯誤的地方歡迎指正。(本文目的: 學習專用)
TypescriptAngular 當初與三個框架當中,最早使用Ts來當作開發語言,之後Vue、React也跟進使用Ts,所以如果有使用過Vue、React的人,會比較熟悉。
VSCode初學者如果要快速建立環境可以使用下方套件:
設定檔案
Angular Extension Pack
其餘工具有時候因為版本問題,會需要安裝其他工具,這邊我們建議使用nvm 來管控版本,可以參考下方連結。
nvm-node版本管理工具
nvm:安裝、切換不同 Node.js 版本的管理器
Component在 Angular 中,組件(Component)是應用程式的基本構建塊之一,用於將使用者界面分解成獨立且可重用的部分。
組件是 Angular 應用程式的基本單位,每個組件代表一個特定的使用者界面區域或元素。每個組件擁有自己的 HTML 模板、CSS 樣式和 TypeScript 代碼,這使得組件能夠獨立運作並與其他組件協同工作。
以下 ...
【Angular】error Unknow argument prod錯誤
Error Unknow argument prod當初使用時, ng build --prod已經無法使用這指令,請使用下方指令排除現狀。
1ng build --configuration production
備註Angular 14 之後版本已經移除 --prod指令,改為 --configuration production。
Angular Cli
參考文件
ithome : https://ithelp.ithome.com.tw/articles/10195372
stackoverflow : https://stackoverflow.com/questions/73156911/ng-build-prod-error-unknown-argument-prod
【Angular】發行到IIS時,如何加入Config加入方式
近期在開發Angular專案都會需要發行專案檔案,往往 Windows 都會使用IIS來發行,但是在發行後架站會出現404錯誤,這時候就需要在Config加入路由設定。(如果放置Config時候,發現網站掛掉或是其他原因可以參考以下做法。)
安裝 URL Rewrite 2.0下載連結 : 點選我一開始需要安裝 URL Rewrite 2.0,安裝完後,就可以開始設定Config。(如果已經安裝過,可以跳過這步驟。)
設定 Config選擇 IIS 管理員,選擇網站,點選 URL Rewrite。點選右邊新增規則,選擇空白規則。
從編輯輸入規則修改以下內容。若修改完可以直接套用即可,詳細內容可以參考下方參考文件。
參考文件
Tips for Running an Angular app in IIS
如何將 Angular 含有路由機制的 SPA 網頁應用程式部署到 IIS 網站伺服器
【Vue】axios因延遲提交無法顯示在頁面
前言近期有努力將 adminlte 套版在專案上,有試著用別人的專案上面改成自己的API,遇到專案上”Menu”是寫死並非是Ajax 回拋過來進行改寫。
使用專案本篇是用這個來做練習。
Github : erdkse/adminlte-3-vue
撰寫 ajax使用前務必要自行安裝 axios
使用教學 : 點選我
修改服務 Auth.ts這邊有關 authorizer 定義,我們將 Menu API 加入在這裡專案上面即可。這個版本有幫你寫好 alert 工具 ,只需要改寫 getError 內容即可。
1234567891011121314151617export const getUsersMenus = async () => { try{ const url :string = "https://localhost:5001/api/user/menus"; let menus:any; await axios .get(url) ...
【IIS】應用程式集區的進階設定的CPU限制
前言引用 “🐰 IIS 應用程式集區的 進階設定 的CPU限制(% 的 1/1000), 只能用 50% 的 CPU,要怎麼設?
您可以透過以下步驟設定 IIS 應用程式集區的 CPU 限制:
打開 IIS 管理員。
選擇您要設定的應用程式集區。
在右側窗格中,點擊「進階設定」。
找到「CPU 限制(% 的 1/1000)」的設定,並將值設為 50000。這表示該應用程式集區只能使用 50% 的 CPU。
點擊「確定」以保存設定。
完成上述步驟後,IIS 應用程式集區將會在運行時限制 CPU 使用率,並避免使用過多的系統資源。請注意,這個設定僅能控制單一應用程式集區的 CPU 使用率,若需要限制整個伺服器的 CPU 使用率,您可能需要考慮其他方式,例如透過作業系統的工具進行設定。“
IIS 程式集程式集的主要作用是提供一個強大的網頁伺服器平台,用於建立、部署和管理各種網站和應用程式
查看”正在執行的要求列表”下圖因為只有短暫開啟網頁,沒使用對外開放表面會看不出來是否有直接關係。若檔案本身有特別處理就會有明顯的效果。
w3wp.exe 工作程序運行於 Micr ...
【筆記】IIS排除 "必須使用Localhost或是127.0.0.1問題"
紀錄目的架設網站時若連線出現下圖問題,可以參考以下作法。
使用方式請打開 [服務] 後找尋下圖的ASP.NET State service,將它設為自動後並啟動,完成後網站將可連線
(筆記) IIS - 排除 "APK檔案無法下載"
紀錄目的若遇到APK檔案無法下載時候,先確認IIS中的MIME是否有設定。
使用方式按下新增按鈕後,打下方提供的字輸入在MIME類型中,記得副檔名要打.apk 才會生效。
1application/vnd.android.package-archive
備註網際網路媒體型別(Internet media type)
原名叫“Type MIME”或“MIME”或在頭資訊中各種協議之後的內容種類(Content-type),他有兩部分用來在Internet上鑑別資料格式。一個Type MIME至少包括兩個部分:一個型別和一個子型別和一個或多個其他需要的引數。引數要求一個Uri 和一個網際網路媒體型別,返回一個Intent物件。通過setDataAndType 就可以實現更新,下載,開啟新應用等功能。P.S. APK 檔案基於 ZIP 檔案格式,它與JAR檔案的構造方式相似。它的網際網路媒體類型是:application/vnd.android.package-archive
【Docker】 安裝 Docker Desktop 疑難排解 (使用 Windowns 11)
前言先前電腦重新改為 Windows 11 安裝 Docker Desktop 後,發現無法正常運作,這邊紀錄一下解決方法。
Docker Desktop 安裝這邊就請自行到 Docker 官網下載安裝,這邊就不再贅述。
Docker Desktop 官網
一、打開 BIOS 虛擬化功能
開啟說明 : 點擊連結
Intel 和 AMD 虛擬化名稱:
Intel : VT-x Mode
AMD : SVM Mode
上面文章有特別寫 Intel 與 AMD 的虛擬化功能開啟方式,這邊就不再贅述。
二、安裝 WSL
開啟說明 : 點擊連結
安裝 WSL 方式可以透過指令方式安裝,也可以到 Windows Store 下載 ubuntu 來安裝。
三、開啟 Windows 虛擬化功能這邊可以直接下以下指令來開啟 Windows 虛擬化功能,開啟後需要重新開機。
123Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linuxdism.exe /online /enable ...
【Git】- 比較前後差異(二) diff2html 產生UI差異報告
diff2htmlGit 是現今程式開發中不可或缺的工具之一,它讓我們可以輕鬆地追蹤程式碼的變更並且進行版本控制。不過遇到需要產出與前一版本的差異給其他人看,因此我使用這個套件。這邊我們使用cli 方便用指令與commit 之間去做比較。
官方網址 : https://diff2html.xyz/
前置作業必須先有 Node.js 才能進行下列順序。
安裝diff2html : npm install -g diff2html-cli
確認 diff2html 可以使用 : diff2html -v
如果不能正常使用,主要原因exe 沒有憑證,會被系統擋住不可以使用,解決方式如下 :
1Set-ExecutionPolicy RemoteSigned
`官方網址 : https://learn.microsoft.com/zh-tw/powershell/module/microsoft.powershell.core/about/about_execution_policies?view=powershell-7.3
使用方式Github : https://g ...