Angular 12 Universal 解決Configuration 'development' is not set in the workspace.

前言

Angular 12釋出後,趁著空檔把手邊的小專案更新上去
後來有了SSR的需求,又再增加Universal

執行dev:ssr,卻出現

Configuration 'development' is not set in the workspace.

專案太新,搜尋皆沒有答案

僅在stack overflow查到有人跟我一樣的問題,但仍沒解法

最後提問者降回11,即能正常運作

試了許久最後成功試出,也不確定這樣作法是否正確,但至少能順利運作了
並將解法亦回覆在stack overflow供大家參考討論

作法

serve:ssr > configurations > development移除:development,即可正常運作

"serve-ssr": {
          "builder": "@nguniversal/builders:ssr-dev-server",
          "configurations": {
            "development": {
              "browserTarget": "<YOUR_PROJECT_NAME>:build", <--- remove `:development` here
              "serverTarget": "<YOUR_PROJECT_NAME>:server"  <--- remove `:development` here
            },
            "production": {
              "browserTarget": "<YOUR_PROJECT_NAME>:production",
              "serverTarget": "<YOUR_PROJECT_NAME>:server:production"
            }
          },
          "defaultConfiguration": "development"
        },

心得

angular.json研究了許久

從錯誤訊息來看,感覺就是architect裡的configurations少了development

但直接複製production,並命名為development仍是出現一樣的訊息

serve-ssrdefaultConfiguration改成production,發現可以運作
衍生的問題就是environment參數會被environment.prod覆蓋掉

合理。但會在開發上造成極大的困擾!
畢竟測試環境所使用的參數一定跟正式環境仍有所差別的

最後比對了加入SSR之前angular.json的樣子,發現serve裡原本就沒有:development

抱著嘗試的心態刪掉後,居然就成功運作了!
而且也不會使用到environment.prod
試了一段時間感覺也沒什麼大問題

看看之後我回覆在stack overflow的作法,會不會有其他高人解釋原因了@@~