angular - Amplify angular build error

Question

I am using Amplify angular in an Angular project. having error when building.

here the error :

ERROR in node_modules/@ionic/core/dist/types/utils/overlays.d.ts(9,82): error TS2344: Type 'keyof B' does not satisfy the constraint 'string'.
Type 'string | number | symbol' is not assignable to type 'string'. Type 'number' is not assignable to type 'string'.

Package.json

{
    "name": "******",
    "version": "0.0.2",
    "license": "UNLICENSED",
    "config": {
        "host": "*********",
        "cloudfront": "**********"
    },
    "scripts": {
        "ng": "ng",
        "start": "[ -f src/aws-exports.js ] && mv src/aws-exports.js src/aws-exports.ts || ng serve; ng serve",
        "build": "npm run commit && [ -f src/aws-exports.js ] && mv src/aws-exports.js src/aws-exports.ts || ng build --configuration=production; ng build --configuration=production",
        "commit": "git add -A && git commit -m 'an other commit' && git push",
        "deploy": "aws s3 rm s3://$npm_package_config_host --recursive && aws s3 sync ./dist/browser s3://$npm_package_config_host --cache-control='max-age=2628000, public' && aws cloudfront create-invalidation --distribution-id $npm_package_config_cloudfront --paths '/*'",
        "build:ssr": "npm run build:client-and-server-bundles && npm run webpack:server",
        "serve:ssr": "node dist/server",
        "build:client-and-server-bundles": "ng build --configuration=production && ng run ******:server",
        "webpack:server": "webpack --config webpack.server.config.js --progress --colors"
    },
    "private": true,
    "dependencies": {
        "@angular/animations": "^6.1.0",
        "@angular/common": "^6.1.0",
        "@angular/compiler": "^6.1.0",
        "@angular/core": "^6.1.0",
        "@angular/forms": "^6.1.0",
        "@angular/http": "^6.1.0",
        "@angular/platform-browser": "^6.1.0",
        "@angular/platform-browser-dynamic": "^6.1.0",
        "@angular/platform-server": "^6.1.0",
        "@angular/router": "^6.1.0",
        "@nguniversal/common": "^6.0.0",
        "@nguniversal/express-engine": "^6.0.0",
        "@nguniversal/module-map-ngfactory-loader": "^6.0.0",
        "@tinymce/tinymce-angular": "^2.0.0",
        "aws-amplify": "^1.0.4",
        "aws-amplify-angular": "^1.0.2",
        "aws-sdk": "2.282.1",
        "bootstrap": "^4.1.3",
        "chart.js": "^2.7.2",
        "classlist.js": "^1.1.20150312",
        "core-js": "^2.5.7",
        "jquery": "^3.3.1",
        "ngx-quill": "^3.3.0",
        "popper.js": "^1.14.3",
        "quill": "^1.3.6",
        "sha1": "^1.1.1",
        "ts-loader": "^4.4.2",
        "web-animations-js": "^2.3.1",
        "zone.js": "^0.8.26"
    },
    "devDependencies": {
        "@angular-devkit/build-angular": "~0.7.1",
        "@angular/cli": "^6.1.1",
        "@angular/compiler-cli": "^6.1.0",
        "@angular/language-service": "^6.1.0",
        "@types/jquery": "^3.3.5",
        "@types/node": "^10.5.4",
        "codelyzer": "~4.4.2",
        "cpy-cli": "^2.0.0",
        "express": "^4.16.3",
        "http-server": "^0.11.1",
        "protractor": "~5.4.0",
        "reflect-metadata": "^0.1.12",
        "rxjs": "^6.2.2",
        "ts-node": "~7.0.0",
        "tslint": "~5.11.0",
        "typescript": "~2.9.2",
        "webpack-cli": "^3.1.0"
    }
}

angular.json configuration

  "configurations": {
                        "production": {
                            "optimization": true,
                            "outputHashing": "all",
                            "sourceMap": false,
                            "extractCss": true,
                            "namedChunks": true,
                            "aot": true,
                            "extractLicenses": true,
                            "vendorChunk": true,
                            "buildOptimizer": true,
                            "fileReplacements": [{
                                "replace": "src/environments/environment.ts",
                                "with": "src/environments/environment.prod.ts"
                            }]
                        }
                    }

标签： angularaws-amplify

Answer 1

Apparently it's a bug with Ionic package, at build even if you don't use ionic.it is fixed by the ionic team, but not yet updated by the amplify team. so just waiting for new versions,

i can confirm, and according to the github bug issuer that there is a workaround waiting the update :

"compilerOptions": { "keyofStringsOnly": true }

here the github issue