NativeScript - Migrating Project Structure - nativescript

Question

I want to migrate an Angular app to a {N} code-sharing structure. I used this article to get started. Would you help me solve the below issue? It seems like a mis-configuration.
When I execute:
ng add #nativescript/schematics
I get the following error:
success Saved 1 new dependency.
info Direct dependencies
└─ #nativescript/schematics#0.5.0
info All dependencies
└─ #nativescript/schematics#0.5.0
✨ Done in 3.25s.
Installed packages for tooling via yarn.
Two or more projects are using identical roots. Unable to determine project using current working directory. Using default workspace project instead.
Reading Project Settings
Project settings:
{
"root": "",
"sourceRoot": "src",
"mainName": "main",
"mainPath": "src/main.ts",
"tsConfig": "src/tsconfig.json",
"entryModuleClassName": "RootModule",
"entryModuleImportPath": "./root.module",
"entryModuleName": "Root",
"entryModulePath": "/src/root.module.ts",
"entryComponentClassName": "RootComponent",
"entryComponentImportPath": "./root.component",
"entryComponentName": "Root",
"entryComponentPath": "/src/root.component.ts",
"indexAppRootTag": "app-root"
}
Adding #nativescript/schematics to angular.json
Adding {N} files
Adding App_Resources
Adding NativeScript specific exclusions to .gitignore
Adding NativeScript run scripts to package.json
Adding NativeScript Project ID to package.json
Excluding NativeScript files from web tsconfig
Adding Sample Shared Component
Two or more projects are using identical roots. Unable to determine project using current working directory. Using default workspace project instead.
Two or more projects are using identical roots. Unable to determine project using current working directory. Using default workspace project instead.
Specified module does not exist
My #angular packages are 7.1.1
I use yarn as a package manager.
This is my angular.json:
{
"$schema": "./node_modules/#angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"my-ns-project": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"architect": {
"build": {
"builder": "#angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "src/tsconfig.json",
"polyfills": "src/polyfills.ts",
"assets": [
// assets
],
"styles": [
// styles
],
"scripts": [
// scripts
]
},
"configurations": {
"hmr": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.hmr.ts"
}
]
},
"production": {
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
]
}
}
},
"serve": {
"builder": "#angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "my-ns-project:build"
},
"configurations": {
"hmr": {
"browserTarget": "my-ns-project:build:hmr"
},
"production": {
"browserTarget": "my-ns-project:build:production"
}
}
},
"extract-i18n": {
"builder": "#angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "my-ns-project:build"
}
},
"test": {
"builder": "#angular-devkit/build-angular:karma",
"options": {
"tsConfig": "src/tsconfig.json",
"main": "src/test.ts",
"karmaConfig": "./karma.conf.js",
"polyfills": "src/polyfills.ts",
"styles": [
// styles
],
"scripts": [
// scripts
],
"assets": [
// assets
]
}
},
"lint": {
"builder": "#angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"src/tsconfig.json"
],
"exclude": []
}
}
}
},
"my-ns-project-e2e": {
"root": "",
"sourceRoot": "",
"projectType": "application",
"architect": {
"e2e": {
"builder": "#angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "./protractor.conf.js",
"devServerTarget": "my-ns-project:serve"
}
},
"lint": {
"builder": "#angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"e2e/tsconfig.json"
],
"exclude": []
}
}
}
}
},
"defaultProject": "my-ns-project",
"cli": { "defaultCollection": "#nativescript/schematics" },
"schematics": {
"#schematics/angular:component": {
"prefix": "app",
"styleext": "css"
},
"#schematics/angular:directive": {
"prefix": "app"
}
}
}
Any help is highly appreciated!

Answer 1

Need to follow the following steps
Create a new angular app using - ng new my-app
Navigate to my-app folder
Execute command - ng add #nativescript/schematics
Finally execute tns run android --bundle - this will generate an auto generated page in emulator.
I see some differences in the project settings.