AppComponent is part of the declaration of 2 modules when building with aot

[gummibjorn]

When building with tns run android --bundle --env.aot aot compilation fails with:

AppComponent in app.component.tns.ts is part of the declarations of 2 modules: AppModule in app.module.ts and AppModule in app.module.tns.ts!

package.json:

    "@angular-devkit/build-angular": "^0.8.4",
    "@angular-devkit/core": "^0.8.4",
    "@angular/cli": "6.1.0",
    "@angular/compiler-cli": "6.1.0",
    "@nativescript/schematics": "^0.3.1"

[sis0k0]

Hey @gummibjorn, probably the issue is caused by invalid typescript configuration. Can you share the contents of the following files?

• tsconfig.json (the common TS configuration)
• tsconfig.tns.json (the {N} TS configuration)
• src/tsconfig.app.json (the Web TS configuration)

[gonick]

I am having the same issue. Can anyone help please.

if I build the app without --env.aot I get no error. But, while building with --env.aot I get error as:

ERROR in : Type AppComponent in /src/app/app.component.tns.ts is part of the declarations of 2 modules: AppModule in /src/app/app.module.ts and AppModule in /src/app/app.module.tns.ts! Please consider moving AppComponent in /src/app/app.component.tns.ts to a higher module that imports AppModule in /src/app/app.module.ts and AppModule in /src/app/app.module.tns.ts. You can also create a new NgModule that exports and includes AppComponent in /src/app/app.component.tns.ts then import that NgModule in AppModule in src/app/app.module.ts and AppModule in /src/app/app.module.tns.ts.

[tsonevn]

Hi @gonick, Can you provide the requested info in the comment above https://github.com/NativeScript/nativescript-schematics/issues/140#issuecomment-446995202?

[gonick]

tsconfig.json { "compileOnSave": false, "compilerOptions": { "outDir": "./dist/out-tsc", "declaration": false, "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, "target": "es5", "typeRoots": [ "node_modules/@types" ], "lib": [ "es2017", "dom", "es6", "es2015.iterable" ], "module": "es2015", "baseUrl": ".", "paths": { "~/": [ "src/" ], "": [ "./node_modules/tns-core-modules/", "./node_modules/*" ] } } }

tsconfig.tns.json

{ "extends": "./tsconfig", "compilerOptions": { "module": "es2015", "moduleResolution": "node" } }

src/tsconfig.app.json { "extends": "../tsconfig.json", "compilerOptions": { "outDir": "../out-tsc/app", "baseUrl": "./", "module": "es2015", "types": [ "googlemaps" ] }, "exclude": [ "test.ts", "/*.spec.ts", "/.tns.ts", "**/.android.ts", "**/*.ios.ts", "./main.ns.aot.ts", "./main.ns.ts" ] }

[gonick]

@tsonevn any update?

[dottodot]

I have the same issue it complaining about a module that isn't even included in the app.

[dottodot]

Here's my configs

tsconfig.json

{
    "compileOnSave": false,
    "compilerOptions": {
        "importHelpers": true,
        "outDir": "./dist/out-tsc",
        "declaration": false,
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "target": "es5",
        "typeRoots": [
            "node_modules/@types"
        ],
        "lib": [
            "es2017",
            "dom",
            "es6",
            "es2015.iterable"
        ],
        "baseUrl": ".",
        "paths": {
            "~/*": [
                "src/*"
            ],
            "*": [
                "./node_modules/tns-core-modules/*",
                "./node_modules/*"
            ]
        }
    },
    "exclude": [
        "**/*.tns.ts",
        "**/*.android.ts",
        "**/*.ios.ts",
        "**/*.spec.ts"
    ]
}

tsconfig.tns.json

{
    "extends": "./tsconfig",
    "compilerOptions": {
        "module": "es2015",
        "moduleResolution": "node"
    }
}

tsconfig.app.json

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "./out-tsc/app",
    "baseUrl": "./",
    "module": "es2015",
    "types": []
  }
}

[dottodot]

Seems like something to do with using forRoot on a shared module.

[drewpayment]

I'm having the same issues and have identical tsconfig settings to @dottodot. I would really like to use AOT since I structured my modules for lazy-loading.

Any updates?

[mosilver]

I have the same problem - when building ng app with --prod flag (AOT) that has share components with nativescript:

ERROR in : Type DestinationSelectorComponent in /src/app/components/destination-selector/destination-selector.component.ts is part of the declarations of 2 modules: TicketModule in /src/app/modules/ticket/ticket.module.ts and TicketModule in /src/app/modules/ticket/ticket.module tns.ts!

tsconfig:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
        "~/*": [
            "src/*"
        ],
        "*": [
            "./node_modules/tns-core-modules/*",
            "./node_modules/*"
        ],
        "mainApp/*": [
            "./src/app/*"
        ],
        "adminApp/*": [
            "./projects/admin/src/app/*"
        ]
    },
    "importHelpers": true,
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "es2015",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "allowJs": true,
    "target": "es5",
    "types": ["googlemaps"],
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
        "es2017",
        "dom",
        "es6",
        "es2015.iterable"
    ]
  },
  "exclude": [
      "**/*.tns.ts",
      "**/*.android.ts",
      "**/*.ios.ts",
      "**/*.spec.ts",
      "node_modules",
      "**/*.aot.ts"
  ]
}

tsconfig.tns:

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "module": "es2015",
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "allowJs": true
  },
  "exclude": [
        "**/*.tns.ts",
        "**/*.android.ts",
        "**/*.ios.ts",
        "**/*.spec.ts",
        "e2e",
        "projects"
    ]
}

package.json:

"dependencies": {
    "@angular/animations": "^7.1.2",
    "@angular/cdk": "^6.2.0",
    "@angular/common": "^7.1.2",
    "@angular/compiler": "^7.1.2",
    "@angular/core": "^7.1.2",
    "@angular/forms": "^7.1.2",
    "@angular/http": "^7.1.2",
    "@angular/material": "^6.4.2",
    "@angular/material-moment-adapter": "^6.4.2",
    "@angular/platform-browser": "^7.1.2",
    "@angular/platform-browser-dynamic": "^7.1.2",
    "@angular/router": "^7.1.2",
    "bootstrap": "^4.1.3",
    "core-js": "^2.5.4",
    "font-awesome": "^4.7.0",
    "google-maps": "^3.3.0",
    "hammerjs": "^2.0.8",
    "moment": "^2.22.2",
    "nativescript-angular": "~7.2.0",
    "nativescript-theme-core": "~1.0.4",
    "nativescript-ui-autocomplete": "^3.11.0",
    "nativescript-ui-calendar": "^3.10.0",
    "nativescript-ui-chart": "^3.11.1",
    "nativescript-ui-dataform": "^3.10.1",
    "nativescript-ui-gauge": "^3.8.0",
    "nativescript-ui-listview": "^6.0.0",
    "nativescript-ui-sidedrawer": "^5.1.0",
    "reflect-metadata": "~0.1.12",
    "rxjs": "^6.3.3",
    "sha.js": "^2.4.11",
    "tns-core-modules": "~5.2.0",
    "tslib": "^1.9.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "angular-super-validator": "^2.0.0",
    "@angular-devkit/build-angular": "^0.13.4",
    "@angular/cli": "~7.1.2",
    "@angular/compiler-cli": "^7.1.2",
    "@angular/language-service": "^7.1.2",
    "@nativescript/schematics": "^0.5.1",
    "@types/googlemaps": "^3.30.18",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.2.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^4.0.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "nativescript-dev-sass": "^1.6.1",
    "nativescript-dev-webpack": "^0.20.0",
    "npm-run-all": "^4.1.5",
    "protractor": "^5.4.2",
    "ts-node": "~5.0.1",
    "tslint": "~5.9.1",
    "typescript": "~3.1.6",
    "uglifyjs-webpack-plugin": "^2.1.2"
  },
  "nativescript": {
    "name": "gtvticketshop",
    "id": "org.nativescript.gtshop",
    "tns-android": {
      "version": "5.2.1"
    }
  }

[erkanarslan]

I have the same problem too.

Edit:

In my project, I have excluded some files from mobile app by putting an exclude array into tsconfig.tns.json file. I noticed that removing exclude array, changes the error message. It seems that, I have to copy the contents of exclude array in tsconfig.json into tsconfig.tns.json before my own exclude list like this:

{
    "extends": "./tsconfig",
    "compilerOptions": {
        "module": "es2015",
        "moduleResolution": "node"
    },
    "exclude": [
        "**/*.tns.ts",
        "**/*.android.ts",
        "**/*.ios.ts",
        "**/*.spec.ts",
        "other/paths/here"
    ]
}

But this is quite unexpected because you don't exclude tns, android and ios files when building for mobile devices. But it works. Maybe you should look into this or mention this in the documentation.

[armackey]

Same error when attempting server side rendering. Command npm run build:ssr.

[tanekim88]

Same problem.

[kartikwatwani]

I added "**/*.tns.ts", in exclude array of tsconfig.app-srr.json and the command npm run build:ssr ran smoothly.

    "exclude": [
      "**/*.tns.ts",
      "test.ts",
      "**/*.spec.ts"
    ],

[tahir-jamil]

Still not working @tsonevn Any new updates about it

[demetrio812]

@tsonevn I have the same issues when building with AOT, any idea on how to fix it?

I've tried creating a new project and copying the tsconfig but same results. If I remove the shared.module.ts and rename shared.module.tns.ts to shared.module.ts it works (for mobile obviously)

Also I've tries removing all the content inside shared.module.ts but it would give me the same error, as if the tns is copied correctly but it's also considered during the build.

Any hint?

Thanks

[Fatme]

Hey @demetrio812,

I tried to reproduce the issue with newly created application but without success. I executed the following steps:

1. ng new myApp
2. cd myApp
3. ng add @nativescript/schematics@next
4. tns run android --env.aot

The webpack compilation was successful and no errors were printed on the console.

Can you give us your exact step when creating the new application so we're able to reproduce the problem on our side?

[andrewshortall]

Any solution for this yet? I'm getting the same errors as above for all modules that have both a .ts and .tns.ts file. My config is also pretty much the same. AOT is quite important for our production build. Would really appreciate some help. Thanks!

[erkanarslan]

@andrewshortall Did you try my suggestion above? Does it solve your problem?

[iamabs2001]

whats the progress ?

[PetroSuch]

any ideas ?