nativescript-schematics

nativescript-schematics copied to clipboard

Environment

Angular CLI: 10.2.0 Node: 14.15.0 OS: win32 x64

Provide the content of the package.json file in the project:

{
  "name": "hello-shared",
  "main": "main.tns.js",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "android": "tns run android --no-hmr",
    "ios": "tns run ios --no-hmr",
    "mobile": "tns run",
    "preview": "tns preview",
    "ngcc": "ngcc --properties es2015 module main --first-only",
    "postinstall": "npm run ngcc"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~10.1.0",
    "@angular/common": "~10.1.0",
    "@angular/compiler": "~10.1.0",
    "@angular/core": "~10.1.0",
    "@angular/forms": "~10.1.0",
    "@angular/platform-browser": "~10.1.0",
    "@angular/platform-browser-dynamic": "~10.1.0",
    "@angular/router": "~10.1.0",
    "core-js": "^3.6.0",
    "@nativescript/angular": "~10.1.0",
    "@nativescript/core": "~7.0.0",
    "@nativescript/theme": "~2.5.0",
    "reflect-metadata": "~0.1.12",
    "rxjs": "~6.6.0",
    "tslib": "1.10.0",
    "zone.js": "~0.11.1"
  },
  "devDependencies": {
    "@angular/cli": "~10.1.0",
    "@angular/compiler-cli": "~10.1.0",
    "@angular-devkit/build-angular": "~0.1001.0",
    "@nativescript/tslint-rules": "~0.0.5",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.11.1",
    "codelyzer": "^5.1.2",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.4.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~2.1.0",
    "karma-jasmine": "~3.0.1",
    "karma-jasmine-html-reporter": "^1.4.2",
    "@nativescript/webpack": "~3.0.0",
    "protractor": "~5.4.3",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~3.9.0"
  }
}

Describe the bug

After creating a new code-sharing project, ng serve results in an error and the demo is not shown.

From Angular CLI:

ERROR in ./src/polyfills.ts
Module not found: Error: Can't resolve 'core-js/es7/reflect' in 'C:\git\playground\hello-shared\src'

To Reproduce

1. Create new code-sharing project with ng new -c=@nativescript/schematics ns-demo --shared.
2. Run ng serve.

Expected behavior Creating a new code-sharing project should include all files created in a new 10.1.0 Angular project (ng new). Notably, a .browserslistrc file was not created. Adding this file with the default content will resolve the issue:

# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries

# For the full list of supported browsers by the Angular framework, please see:
# https://angular.io/guide/browser-support

# You can see what browsers were selected by your queries by running:
#   npx browserslist

last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major versions
last 2 iOS major versions
Firefox ESR
not IE 9-10 # Angular support for IE 9-10 has been deprecated and will be removed as of Angular v11. To opt-in, remove the 'not' prefix on this line.
not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the 'not' prefix on this line.

Before Angular CLI used differential loading (see 1 and 2) a project dependency on core-js was necessary. The expected core-js was ~2.5.0, which provided different paths. The issue can alternatively be fixed by updating the default src/polyfills.ts file: replace import 'core-js/es7/reflect'; with import 'core-js/es/reflect';. This is less preferable than using differential loading by default.