EXCEPTION: Runtime compiler is not loaded

runtime compiler is not loaded angular 8
runtime compiler is not loaded angular 9
error: runtime compiler is not loaded angular 9
error: runtime compiler is not loaded error
angular jit compilation failed: '@angular/compiler' not loaded!
angular aot error: runtime compiler is not loaded
loadchildren angular 9
error in failed to list lazy routes: unknown module
Versions.

@angular/cli@1.0.0-rc.2

Repro steps.

ng build -prod -e prod

The log given by the failure.
vendor.380a744….bundle.js:218 Error: Runtime compiler is not loaded
    at new Error (native)
    at Error.d (http://localhost:9000/portal/assets/dist/polyfills.a61f849adcea6ec74b69.bundle.js:36:1731)
    at r (http://localhost:9000/portal/assets/dist/vendor.380a74466a8bf08fbdda.bundle.js:1410:3338)
    at t.compileModuleAndAllComponentsAsync (http://localhost:9000/portal/assets/dist/vendor.380a74466a8bf08fbdda.bundle.js:1417:702)
    at e.ngOnChanges (http://localhost:9000/portal/assets/dist/main.f4b767a4fe115c7bb97e.bundle.js:1:1171229)
    at e.ngDoCheck (http://localhost:9000/portal/assets/dist/main.f4b767a4fe115c7bb97e.bundle.js:1:914180)
    at t.GGjx.t.detectChangesInternal (http://localhost:9000/portal/assets/dist/main.f4b767a4fe115c7bb97e.bundle.js:1:332790)
    at t.R2h3.t.detectChanges (http://localhost:9000/portal/assets/dist/vendor.380a74466a8bf08fbdda.bundle.js:653:5749)
    at t.Sqya.t.detectChangesInNestedViews (http://localhost:9000/portal/assets/dist/vendor.380a74466a8bf08fbdda.bundle.js:667:780)
    at t.GGjx.t.detectChangesInternal (http://localhost:9000/portal/assets/dist/main.f4b767a4fe115c7bb97e.bundle.js:1:329907)
    at t.R2h3.t.detectChanges (http://localhost:9000/portal/assets/dist/vendor.380a74466a8bf08fbdda.bundle.js:653:5749)
    at t.R2h3.t.internalDetectChanges (http://localhost:9000/portal/assets/dist/vendor.380a74466a8bf08fbdda.bundle.js:653:5542)
    at t.YSmj.t.detectChangesInternal (http://localhost:9000/portal/assets/dist/main.f4b767a4fe115c7bb97e.bundle.js:1:662563)
    at t.R2h3.t.detectChanges (http://localhost:9000/portal/assets/dist/vendor.380a74466a8bf08fbdda.bundle.js:653:5749)
    at t.Sqya.t.detectChangesInNestedViews (http://localhost:9000/portal/assets/dist/vendor.380a74466a8bf08fbdda.bundle.js:667:780)

package.json

{
  "name": "app",
  "version": "1.0.0",
  "description": "Origianlly fomr a webpack starter for angular 2",
  "scripts": {
    "build": "ng build -dev -e dev",
    "build:aot": "ng build -prod -e prod --aot true",
    "build:prod": "ng build -prod -e prod",
    "postbuild": "node build.js",
    "postbuild:prod": "node build.js",
    "watch": "ng build -dev -w true",
    "postinstall": "typings install",
    "start": "ng serve",
    "lint": "ng lint --format stylish",
    "test": "ng test --watch false --single-run false",
    "pree2e": "webdriver-manager update --standalone false --gecko false",
    "e2e": "ng e2e",
    "prepush": "npm test && npm run lint"
  },
  "author": "Mikeumus",
  "private": true,
  "dependencies": {
    "@angular/common": "2.4.0",
    "@angular/compiler": "2.4.0",
    "@angular/core": "2.4.0",
    "@angular/flex-layout": "2.0.0-rc.1",
    "@angular/forms": "2.4.0",
    "@angular/http": "2.4.0",
    "@angular/material": "2.0.0-beta.2",
    "@angular/platform-browser": "2.4.0",
    "@angular/platform-browser-dynamic": "2.4.0",
    "@angular/router": "3.4.0",
    "@types/lodash": "4.14.50",
    "classlist.js": "^1.1.20150312",
    "core-js": "2.4.1",
    "hammerjs": "2.0.8",
    "intl": "1.2.5",
    "lodash": "4.15.0",
    "moment": "2.17.1",
    "moment-timezone": "0.5.11",
    "ng2-interceptors": "1.2.4",
    "reflect-metadata": "0.1.10",
    "rxjs": "5.1.0",
    "snapsvg": "0.5.1",
    "snapsvg-cjs": "0.0.4",
    "web-animations-js": "^2.2.2",
    "zone.js": "0.7.6"
  },
  "devDependencies": {
    "@angular/cli": "1.0.0-rc.2",
    "@angular/compiler-cli": "2.4.0",
    "@types/core-js": "0.9.37",
    "@types/jasmine": "2.5.38",
    "@types/moment-timezone": "0.2.34",
    "@types/node": "6.0.60",
    "@types/selenium-webdriver": "3.0.0",
    "@types/snapsvg": "0.4.27",
    "autoprefixer": "6.7.7",
    "codelyzer": "2.0.0",
    "husky": "0.13.2",
    "istanbul-instrumenter-loader": "0.2.0",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "3.2.0",
    "karma": "1.4.1",
    "karma-cli": "1.0.1",
    "karma-coverage": "1.0.0",
    "karma-jasmine": "1.0.2",
    "karma-mocha-reporter": "2.0.3",
    "karma-phantomjs-launcher": "^1.0.2",
    "karma-remap-istanbul": "0.2.1",
    "karma-sourcemap-loader": "0.3.7",
    "karma-spec-reporter": "0.0.30",
    "protractor": "5.1.0",
    "remap-istanbul": "0.6.4",
    "ts-node": "2.1.0",
    "tslint": "4.5.1",
    "typedoc": "0.5.7",
    "typescript": "2.0.3"
  }
}

.angular-cli.json

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "project": {
    "name": "app"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "../public/dist",
      "assets": [],
      "index": "index.html",
      "main": "main.ts",
      "polyfills": "polyfills.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.app.json",
      "testTsconfig": "tsconfig.spec.json",
      "prefix": "",
      "styles": [],
      "scripts": [],
      "environmentSource": "environments/environment.ts",
      "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }
  ],
  "e2e": {
    "protractor": {
      "config": "./protractor.conf.js"
    }
  },
  "lint": [
    {
      "project": "src/tsconfig.app.json"
    },
    {
      "project": "src/tsconfig.spec.json"
    },
    {
      "project": "e2e/tsconfig.e2e.json"
    }
  ],
  "test": {
    "karma": {
      "config": "./karma.conf.js"
    }
  },
  "defaults": {
    "styleExt": "scss",
    "prefixInterfaces": false,
    "inline": {
      "style": false,
      "template": false
    },
    "spec": {
      "class": false,
      "component": true,
      "directive": true,
      "module": false,
      "pipe": true,
      "service": true
    },
    "viewEncapsulation": "Emulated",
    "changeDetection": "Default"
  }
}

I've taken a lot of time to make sure my app is matching packages and conventions of a fresh cli-rc2 app (ng new) with no luck yet. Much of the app renders fine, I think it's one part of the code that uses compiler.compileModuleAndAllComponentsAsync<any>( this.moduleType ).

Loading children with a function instead of a module string path can cause production builds to raise Runtime compiler is not loaded.

In order to fix the error, look out for loadChildren declarations in the format of:

{
    path: ':id',
    component: MainComponent,
    children: [
      {
        path: '',
        loadChildren: () => SubModule
      }
    ]
  }

and change them to:

  {
    path: ':id',
    component: MainComponent,
    children: [
      {
        path: '',
        loadChildren: './sub-module/sub-module.module#SubModule'
      }
    ]
  }

Error: Runtime compiler is not loaded in angular6 --prod mode , Error: Runtime compiler is not loaded in angular6 --prod mode #23878. Closed. pankajsri03 opened this issue on May 13, 2018 � 23 comments. Closed� Bug Report or Feature Request (mark with an x) bug report Versions. 1.0.0-rc.2 Repro steps. ng build -prod -e prod The log given by the failure. vendor.380a744….bundle.js:218 Error: Runtime compile

I had this problem in Angular 7

The Angular 7 docs are here - https://v7.angular.io/guide/lazy-loading-ngmodules#lazy-loading-feature-modules

When I used this approach (seen in the Angular docs) I get a runtime error as follows:

loadChildren: './customers/customers.module#CustomersModule'

Could not resolve module relative to app\app.module.ts

When I used this approach AOT build would not work, failing with "Runtime compiler is not loaded":

loadChildren: () => import('./customers/customers.module').then((mod) => mod.CustomersModule)

I fixed it by adding a path to tsconfig.app.json for the customers directory as follows:

"@customers/*": ["app/customers/*"]

And using the path when lazy loading as follows:

loadChildren: '@customers/customers.module#CustomersModule'

EXCEPTION: Runtime compiler is not loaded, Loading children with a function instead of a module string path can cause production builds to raise Runtime compiler is not loaded . In order� V8.0.0 : loadChildren library module failed : "Error: Runtime compiler is not loaded" on AOT mode #14763 Closed robinComa opened this issue Jun 7, 2019 · 23 comments

angular-cli build prod "Runtime compiler is not loaded”, angular-cli build prod "Runtime compiler is not loaded” - angular. compiler is not loaded, Trouble shoot "Runtime compiler is not loaded") around which suggest that lazy loading a Duplicate: EXCEPTION: Runtime compiler is not loaded� 2011-08-08 14:25:26,272 [ 786091] DEBUG - la.compiler.ScalacOutputParser - [loaded package loader runtime in 13ms] 2011-08-08 14:25:26,306 [ 786125] DEBUG - la.compiler.ScalacOutputParser - Exception in thread "main" java.lang.RuntimeException: Compiler classes not found:

EXCEPTION: Runtime compiler is not loaded - angular - html, #angular/cli#1.0.0-rc.2 Repro steps. ng build -prod -e prod The log given by the failure. vendor.380a744….bundle.js:218 Error: Runtime compiler is not loaded at � If the runtime determines that an assembly matches the calling assembly's criteria, it uses that assembly. When the file specified by the given <codeBase> element is loaded, the runtime checks to make sure that the name, version, culture, and public key match the calling assembly's reference.

angular-cli build prod "Runtime compiler is not loaded”, I did ng build -prod and met a weird error that is _zone_symbol__error : Error: Uncaught (in promise): Error: Runtime compiler is not loaded Error: Runtime� @indraraj26 - thanks for submitting this issue. We will need more information than this to identify your problem. Sometimes this is due to ngcc not running on some of your dependencies causing them not to be AOT compiled into Ivy code - the result of this is that at runtime Angular tries to compile it in the browser.

Error: Runtime compiler is not loaded with production configuration , [Error] ERROR Error: Uncaught (in promise): Error: Runtime compiler is not loaded TimeoutException: The Angular CLI process did not start listening for� The issue is that in dev:edit mode, the build system does not use AOT to compile the AppModule, hence the message about the JIT compiler needing to be loaded at runtime. I'm guessing if you look into this, you'll find that the webpack devserver isn't being invoked with the right set of plugins or something.

Comments
  • Can we have a look at your package.json? All of it, please.
  • Hi @R.Richards, package.json and angular-cli.json are there now above.
  • Angular doesn't ship compiler in aot
  • prod configuration in angular-cli includes aot by default AFAIK
  • github.com/angular/angular/issues/11780