發表文章

目前顯示的是 7月, 2018的文章

[VS2017] ASP.NET Core 搭配 Angular 與 angular-cli

圖片
在建立 ASP.NET Core 整合 Angular 專案時,遇到無法建立 Angular 元件的問題, 在此紀錄處理方式,也提供有相同困擾的捧油! 環境: Microsoft Visual Studio Community 2017 v.15.7.5 ASP.NET Core:2.1.202 Node.js:8.9.1 angular-cli:6.0.8 建置方法: 步驟 1. 建立專案 建立專案:選擇 " .NET Core 專案 " 並選擇 " Angular 範本 " VS2017 已經為我們建立基本的專案架構, 框線中的是 Angular 專案目錄 步驟 2. 安裝 angular-cli 開啟命令列視窗,輸入以下指令以安裝 angular-cli (如果已經安裝過,可以略過此步) npm install -g @angular/cli@latest 進入專案目錄,輸入以下指令以安裝相依性套件 npm install --save-dev @angular/cli@latest 步驟 3. 修改 app.shared.module 檔名 將 ClientApp\app\app.shared.module.ts 改名為 ClientApp\app\app.module.ts 步驟 4. 修改引用 app.shared.module 在前一步驟檔名變更後,會有編譯錯誤,所以有兩個引用處需要修改: ClientApp\app\app.server.module.ts ClientApp\app\app.browser.module.ts 步驟 5. 建立 angular.json 為了使用 Angular CLI,需要 angular.json 設定檔。 但是目前專案下沒有,所以需要用點小技巧建立。 (如果已經有其他 Angular 專案,可以直接跳至步驟 2) 開啟命令提示字元,切換至一個空目錄 (例如:C:/), 輸入以下訊息建立一個 Angular 專案 ng new sample --skip-install   ( --skip-install 參數,明確指定不執行 npm in...