Angular 13 ten Angular 14 e Geçiş Adımları¶

Check-in yapılmamış değişikliklerin olması durumunda değişiklikler checkin yapılır. Github üzerine gönderilmesi tavsiye edilir.
Global Angular Cli yüklenir >>

npm install -g @angular/cli@14.1.0

(NOT : BU İŞLEMİN SADECE 1 DEFA YAPILMASI YETERLİDİR. GLOBAL OLARAK YÜKLEME GERÇEKLEŞTİRİLİR)
Angular projesinin ana dizininde terminal açılır. npm install komutu çalıştırılır. Sonrasında şu komut çalıştırılır >>

ng update @angular/core@14.1.0 @angular/cli@14.1.0 --force

NOT : Komut çalışması uzun sürebilir, stabilite için 14.1.0 sürümünün yüklenmesi önemlidir

Bazı paketler Angular 14 ile uyumlu olmayabilir, yükseltme işleminden sonra sayfalarınızı kontrol etmeniz iyi olacaktır.
package.json dosyanızda yer alan aşağıdaki paketlerin sürümlerini değiştirmeniz gerekmektedir. (octapull.core paketinin son versiyonunun yüklenmesi önerilir)

    "@alpata/octapull.core": "^14.0.1",
    "@angular/cdk": "^14.1.0",
    "@auth0/angular-jwt": "^5.0.2",
    "@fortawesome/angular-fontawesome": "^0.11.1",
    "@fortawesome/fontawesome-free": "^6.1.1",
    "@fortawesome/fontawesome-svg-core": "^6.1.1",
    "@fortawesome/free-brands-svg-icons": "^6.1.1",
    "@fortawesome/free-regular-svg-icons": "^6.1.1",
    "@fortawesome/free-solid-svg-icons": "^6.1.1",
    "@ng-select/ng-select": "^9.0.2",
    "@sweetalert2/ngx-sweetalert2": "^11.0.0",
    "sweetalert2": "^11.4.24",
    "chart.js": "^3.8.0",
    "dayjs": "^1.11.4",
    "filepond": "^4.30.4",
    "filepond-plugin-file-validate-type": "^1.2.8",
    "filepond-plugin-image-preview": "^4.6.11",
    "filepond-plugin-image-resize": "^2.0.10",
    "guid-typescript": "^1.0.9",
    "jspdf-autotable": "^3.5.25",
    "ng-lazyload-image": "^9.1.3",
    "ngx-infinite-scroll": "^14.0.0",
    "ngx-markdown": "^14.0.1",
    "ngx-mask": "^14.0.3",
    "ngx-progressbar": "^9.0.0",
    "ngx-quill": "^18.0.0",
    "ngx-toastr": "^15.0.0",
    "ngx-ui-loader": "^13.0.0",
    "ngx-webstorage": "^10.0.1",
    "ol": "^6.15.1",
    "primeicons": "^5.0.0",
    "primeng": "^14.0.0",
    "rxjs": "~7.5.6",
    "tslib": "^2.4.0",
    "xlsx": "^0.18.5",

package.json dosyasında yer alan ; scripts > publish-subfolder değerindeki --outputHashing=all ve --aot kısmı kaldırılır. logistic modulu için olan komut aşağıdaki gibidir.

  "publish-subfolder": "ng build --configuration production --base-href=/logistic/",

npm install komutu çalıştırılır ve proje çalıştırılır.
Aşağıdaki gibi hata vermesi durumunda. Hata verilen component satırı açılır. İlgili .next() fonksiyonu şu ana kadar o değerler alınmadıysa next(null) olarak revize edilir.

  node_modules/rxjs/dist/types/internal/Subject.d.ts:32:10
    32     next(value: T): void;
                ~~~~~~~~
    An argument for 'value' was not provided.

Aşağıdaki gibi hata vermesi durumunda angular.json dosyası açılır ve "styles": ["node_modules/ol/ol.css"] bölümüne ilgili css dosyası eklenir. Değişikliklerin algılanması için projeyeniden başlatılmalıdır. ("node_modules/ol/ol.css")

./node_modules/ol/ol.css:1:0 - Error: Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> .ol-box {
|   box-sizing: border-box;
|   border-radius: 2px;