Angular app Module Federation with Nx: run locally more than one application keep on refreshing/blinking in browser tab

CP-Ram commented 2 years ago

Current Behavior

Angular app Module Federation with Nx: run locally more than one application keep on refreshing/blinking in browser tab.

Expected Behavior

should able to run Module federation apps locally.

Steps to Reproduce

create an one empty workspace.
create another one empty workspace. 3.In each workspace add nrwl/angular plugin. 4.In each workspace generate nrwl/angular:create an angular application. 5.In one workspace setup-mf remote app (where federation type choose any static or dynamic) 6.In second workspace setup-mf host app.(where federation type choose any static or dynamic) 7.run both application using command npm run start. 8.open in browser tab both application. 9.last serve one keep on blinking.

Package.json

{
  "name": "remotetestapp",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "start": "nx serve",
    "build": "nx build",
    "test": "nx test",
    "postinstall": "ngcc --properties es2020 browser module main",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~14.1.0",
    "@angular/common": "~14.1.0",
    "@angular/compiler": "~14.1.0",
    "@angular/core": "~14.1.0",
    "@angular/forms": "~14.1.0",
    "@angular/platform-browser": "~14.1.0",
    "@angular/platform-browser-dynamic": "~14.1.0",
    "@angular/router": "~14.1.0",
    "rxjs": "~7.4.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~14.1.0",
    "@angular-eslint/eslint-plugin": "~14.0.0",
    "@angular-eslint/eslint-plugin-template": "~14.0.0",
    "@angular-eslint/template-parser": "~14.0.0",
    "@angular/cli": "~14.1.0",
    "@angular/compiler-cli": "~14.1.0",
    "@angular/language-service": "~14.1.0",
    "@nrwl/angular": "^14.5.2",
    "@nrwl/cli": "14.5.2",
    "@nrwl/eslint-plugin-nx": "14.5.2",
    "@nrwl/linter": "14.5.2",
    "@nrwl/workspace": "14.5.2",
    "@types/jasmine": "~4.0.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "16.11.7",
    "@typescript-eslint/eslint-plugin": "^5.29.0",
    "@typescript-eslint/parser": "^5.29.0",
    "eslint": "~8.15.0",
    "eslint-config-prettier": "8.1.0",
    "jasmine-core": "~4.2.0",
    "jasmine-spec-reporter": "~7.0.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.0.0",
    "nx": "14.5.2",
    "prettier": "^2.6.2",
    "protractor": "~7.0.0",
    "ts-node": "~10.8.0",
    "typescript": "~4.7.2"
  }
}

Failure Logs

Error only I can see Browser dev tool console: styles.js:7827 Uncaught SyntaxError: Cannot use 'import.meta' outside a module (at styles.js:7827:29)

Environment

Development

CP-Ram commented 2 years ago

I think this issue also because of using multiple repo issue.so closing this issue. Thanks!

github-actions[bot] commented 1 year ago

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.

nrwl / nx