3

I followed all the steps mentioned here to upgrade my Basic app from 4 to 7 but no matter what I did I was not able to create an angular.json file. Running ng update @angular/cli did not help no matter how many times I ran it.

I'm guessing the problem is that the guide assumes I have angular-cli.json already but Angular 4 did not have the Angular CLI at the time so I don't have an angular-cli.json file already.

I thought I could try creating a new app using ng new test-app and copy over the angular.json file to mine but there are a lot of settings that I need to configure which means there's a lot of room for error with this method.

Does anyone have any idea how I might generate angular.json automatically?

I already updated all my packages (except system.js) to the latest versions and my app is running fine. But I need angular.json in order to publish the app using the CLI.

Here is my package.json:

"dependencies": {
    "@angular/animations": "^7.0.2",
    "@angular/cli": "^7.0.4",
    "@angular/common": "^7.0.2",
    "@angular/compiler": "^7.0.2",
    "@angular/core": "^7.0.2",
    "@angular/forms": "^7.0.2",
    "@angular/http": "^7.0.2",
    "@angular/platform-browser": "^7.0.2",
    "@angular/platform-browser-dynamic": "^7.0.2",
    "@angular/router": "^7.0.2",
    "@ng-bootstrap/ng-bootstrap": "^4.0.0",
    "angular-crumbs": "^3.0.1",
    "angular2-csv": "^0.2.5",
    "core-js": "^2.5.7",
    "ng2-filter-pipe": "^0.1.10",
    "ngx-clipboard": "^11.1.9",
    "ngx-pagination": "^3.2.1",
    "ngx-window-token": "^1.0.2",
    "rxjs": "6.3.3",
    "systemjs": "0.19.40",
    "zone.js": "^0.8.26"
  }

And my SystemJS config file:

map: {
    // our app is within the app folder
    'app': 'app',

    // angular bundles
    '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
    '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
    '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
    '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.min.js',
    '@angular/animations/browser': 'npm:@angular/animations/bundles/animations-browser.umd.js',
    '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
    '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',
    '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
    '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
    '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
    '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

    // other libraries
    'ngx-window-token': 'npm:ngx-window-token/bundles/ngx-window-token.umd.min.js',
    'rxjs': 'npm:rxjs',
    'angular-crumbs': 'npm:angular-crumbs/bundles/angular-crumbs.umd.min.js',
    '@ng-bootstrap/ng-bootstrap': 'npm:@ng-bootstrap/ng-bootstrap/bundles/ng-bootstrap.umd.min.js',
    'ng2-filter-pipe': 'npm:ng2-filter-pipe/dist/index.js',
    'ngx-pagination': 'npm:ngx-pagination/dist/ngx-pagination.umd.js',
    'ngx-clipboard': 'npm:ngx-clipboard/bundles/ngx-clipboard.umd.min.js',
    'angular2-csv': 'npm:angular2-csv/Angular2-csv.js'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
    app: {
        defaultExtension: 'js',
        meta: {
            './*.js': {
                loader: 'systemjs-angular-loader.js'
            }
        }
    },
    rxjs: {
        main: 'index.js',
        defaultExtension: 'js'
    },
    'rxjs/operators': {
        main: 'index.js',
        defaultExtension: 'js'
    }
}

I do get the following warnings when I run ng update @angular/cli:

C:\MyProject>ng update @angular/cli
UPDATE package.json (2265 bytes)
npm WARN angular-crumbs@3.0.1 requires a peer of @angular/common@>=2.0.0 <7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular-crumbs@3.0.1 requires a peer of @angular/core@>=2.0.0 <7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular-crumbs@3.0.1 requires a peer of @angular/platform-browser@>=2.0.0 <7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular-crumbs@3.0.1 requires a peer of @angular/router@>=2.0.0 <7.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular-crumbs@3.0.1 requires a peer of reflect-metadata@^0.1.8 but none is installed. You must install peer dependencies yourself.
npm WARN angular2-csv@0.2.5 requires a peer of @angular/core@^2.0.0||^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular2-csv@0.2.5 requires a peer of @angular/http@^2.0.0||^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular2-csv@0.2.5 requires a peer of rxjs@^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\@angular-devkit\core\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

Thanks.

Sal
  • 5,129
  • 5
  • 27
  • 53
  • please take a look at https://update.angular.io. the new angular.json is created in the update from angular 5 to 6. an update across multiple major versions is not recommanded. – Marc Nov 09 '18 at 21:05
  • No matter which two versions I select (4->5, 5->6, 4->6, 5->7, etc) I never get any details on how to generate angular-cli.json. So even if I updated to 5 first, then 6, I still wouldn't have either the angular-cli.json or the angular.json file. – Sal Nov 09 '18 at 21:28
  • Hi Sal, I am facing similar issue as you mentioned. Did you upgrade it to 7? Can you please help me in this? I am also using system.js with angular 4. Please find below my questions : https://stackoverflow.com/questions/59052007/issue-after-upgrading-angular-4-to-angular-8 and https://stackoverflow.com/questions/59090166/issue-when-migrate-angular-4-with-system-js-and-mvc-to-angular-8 waiting for your reply. Thanks in advance – Hitesh Dec 02 '19 at 03:29
  • Sorry @Marc, i couldn’t find a way. Had to start a new project and add everything one by one. It was a medium sized internal project so it only took a couple of days – Sal Dec 02 '19 at 07:50

0 Answers0