text:
Error: Runtime compiler is not loaded with production configuration

Versions
Angular CLI: 6.0.0-rc.8
Node: 10.0.0
OS: darwin x64
Angular: 6.0.0-rc.6
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.5.11
@angular-devkit/build-angular     0.5.11
@angular-devkit/build-optimizer   0.5.11
@angular-devkit/core              0.5.11
@angular-devkit/schematics        0.5.11
@angular/cli                      6.0.0-rc.8
@ngtools/webpack                  6.0.0-rc.9
@schematics/angular               0.5.11
@schematics/update                0.5.11
rxjs                              6.0.0
typescript                        2.7.2
webpack                           4.6.0

Repro steps

Step 1

ng new temp --routing
ng g module content --routing
ng g component content/content
ng g component content/dashboard

Step 2

Import ContentModule in app.module.ts

Step 3

Add route to routes in app-routing.module.ts
const routes: Routes = [
  {
    path: '',
    loadChildren: () => ContentModule
  }
];

Step 4

Add route to routes in content-routing.module.ts
const routes: Routes = [
  {
    path: '',
    component: ContentComponent,
    children: [
      { path: '', component: DashboardComponent },
    ]
  }
];

Step 5

ng serve --prod

Observed behavior
[Error] ERROR
Error: Uncaught (in promise): Error: Runtime compiler is not loaded bt@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:169141 compileModuleAsync@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:169320 http://localhost:4200/main.a44fbe50412077ad9b05.js:1:347535 _tryNext@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:155394 _next@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:155297 next@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:145942 http://localhost:4200/main.a44fbe50412077ad9b05.js:1:267505 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149203 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 _innerSub@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:155532 _tryNext@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:155475 _next@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:155297 next@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:145942 http://localhost:4200/main.a44fbe50412077ad9b05.js:1:267505 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149203 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 _innerSub@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:155532 _tryNext@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:155475 _next@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:155297 next@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:145942 _next@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:153019 next@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:145942 http://localhost:4200/main.a44fbe50412077ad9b05.js:1:150810 _trySubscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149434 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149225 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 subscribe@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149131 http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149640 e@http://localhost:4200/polyfills.2d976f42c1abc2acac30.js:1:13905 forEach@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:149606 activateRoutes@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:357574 http://localhost:4200/main.a44fbe50412077ad9b05.js:1:357443 e@http://localhost:4200/polyfills.2d976f42c1abc2acac30.js:1:13905 runNavigate@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:354384 onInvoke@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:172758 run@http://localhost:4200/polyfills.2d976f42c1abc2acac30.js:1:2459 http://localhost:4200/polyfills.2d976f42c1abc2acac30.js:1:13703 onInvokeTask@http://localhost:4200/main.a44fbe50412077ad9b05.js:1:172674 runTask@http://localhost:4200/polyfills.2d976f42c1abc2acac30.js:1:3154 d@http://localhost:4200/polyfills.2d976f42c1abc2acac30.js:1:10192 promiseReactionJob@[native code]
j — polyfills.2d976f42c1abc2acac30.js:1:12959
j — polyfills.2d976f42c1abc2acac30.js:1:12509
(anonymous function) — polyfills.2d976f42c1abc2acac30.js:1:13739
onInvokeTask — main.a44fbe50412077ad9b05.js:1:172675
runTask — polyfills.2d976f42c1abc2acac30.js:1:3155
d — polyfills.2d976f42c1abc2acac30.js:1:10193
promiseReactionJob
	at (main.a44fbe50412077ad9b05.js:1:167563)
	handleError (main.a44fbe50412077ad9b05.js:1:167760)
	next (main.a44fbe50412077ad9b05.js:1:179321)
	(anonymous function) (main.a44fbe50412077ad9b05.js:1:171284)
	__tryOrUnsub (main.a44fbe50412077ad9b05.js:1:148022)
	next (main.a44fbe50412077ad9b05.js:1:147199)
	_next (main.a44fbe50412077ad9b05.js:1:146271)
	next (main.a44fbe50412077ad9b05.js:1:145943)
	next (main.a44fbe50412077ad9b05.js:1:157070)
	emit (main.a44fbe50412077ad9b05.js:1:171065)
	run (polyfills.2d976f42c1abc2acac30.js:1:2460)
	onHandleError (main.a44fbe50412077ad9b05.js:1:173042)
	runGuarded (polyfills.2d976f42c1abc2acac30.js:1:2720)
	e (polyfills.2d976f42c1abc2acac30.js:1:11588)
	microtaskDrainDone (polyfills.2d976f42c1abc2acac30.js:1:11637)
	d (polyfills.2d976f42c1abc2acac30.js:1:10260)
	promiseReactionJob

Desired behavior
No error
Note that there is no error with ng serve.
Changing to loadChildren: './content/content.module#ContentModule' in app-routing.module.ts works with ng serve --prod but fails with ng serve. Error below...
[Error] ERROR – Error: Uncaught (in promise): TypeError: Array.prototype.map callback must be a function
map@[native code]
webpackAsyncContext@http://localhost:4200/main.js:59:37
loadAndCompile@http://localhost:4200/vendor.js:35289:82
loadModuleFactory@http://localhost:4200/vendor.js:53879:86
load@http://localhost:4200/vendor.js:53867:52
http://localhost:4200/vendor.js:52064:51
_tryNext@http://localhost:4200/vendor.js:67867:34
_next@http://localhost:4200/vendor.js:67857:26
next@http://localhost:4200/vendor.js:59201:23
http://localhost:4200/vendor.js:62619:24
subscribe@http://localhost:4200/vendor.js:58411:79
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
_innerSub@http://localhost:4200/vendor.js:67877:99
_tryNext@http://localhost:4200/vendor.js:67874:23
_next@http://localhost:4200/vendor.js:67857:26
next@http://localhost:4200/vendor.js:59201:23
_next@http://localhost:4200/vendor.js:67392:30
next@http://localhost:4200/vendor.js:59201:23
http://localhost:4200/vendor.js:74921:28
_trySubscribe@http://localhost:4200/vendor.js:58426:35
subscribe@http://localhost:4200/vendor.js:58411:106
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
http://localhost:4200/vendor.js:58450:43
ZoneAwarePromise@http://localhost:4200/polyfills.js:3207:37
forEach@http://localhost:4200/vendor.js:58446:31
activateRoutes@http://localhost:4200/vendor.js:54651:21
http://localhost:4200/vendor.js:54630:33
ZoneAwarePromise@http://localhost:4200/polyfills.js:3207:37
runNavigate@http://localhost:4200/vendor.js:54552:27
onInvoke@http://localhost:4200/vendor.js:33791:39
run@http://localhost:4200/polyfills.js:2454:49
http://localhost:4200/polyfills.js:3188:37
onInvokeTask@http://localhost:4200/vendor.js:33782:43
runTask@http://localhost:4200/polyfills.js:2504:57
drainMicroTaskQueue@http://localhost:4200/polyfills.js:2911:42
promiseReactionJob@[native code]
Error: Uncaught (in promise): TypeError: Array.prototype.map callback must be a function
map@[native code]
webpackAsyncContext@http://localhost:4200/main.js:59:37
loadAndCompile@http://localhost:4200/vendor.js:35289:82
loadModuleFactory@http://localhost:4200/vendor.js:53879:86
load@http://localhost:4200/vendor.js:53867:52
http://localhost:4200/vendor.js:52064:51
_tryNext@http://localhost:4200/vendor.js:67867:34
_next@http://localhost:4200/vendor.js:67857:26
next@http://localhost:4200/vendor.js:59201:23
http://localhost:4200/vendor.js:62619:24
subscribe@http://localhost:4200/vendor.js:58411:79
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
_innerSub@http://localhost:4200/vendor.js:67877:99
_tryNext@http://localhost:4200/vendor.js:67874:23
_next@http://localhost:4200/vendor.js:67857:26
next@http://localhost:4200/vendor.js:59201:23
_next@http://localhost:4200/vendor.js:67392:30
next@http://localhost:4200/vendor.js:59201:23
http://localhost:4200/vendor.js:74921:28
_trySubscribe@http://localhost:4200/vendor.js:58426:35
subscribe@http://localhost:4200/vendor.js:58411:106
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
subscribe@http://localhost:4200/vendor.js:58408:26
http://localhost:4200/vendor.js:58450:43
ZoneAwarePromise@http://localhost:4200/polyfills.js:3207:37
forEach@http://localhost:4200/vendor.js:58446:31
activateRoutes@http://localhost:4200/vendor.js:54651:21
http://localhost:4200/vendor.js:54630:33
ZoneAwarePromise@http://localhost:4200/polyfills.js:3207:37
runNavigate@http://localhost:4200/vendor.js:54552:27
onInvoke@http://localhost:4200/vendor.js:33791:39
run@http://localhost:4200/polyfills.js:2454:49
http://localhost:4200/polyfills.js:3188:37
onInvokeTask@http://localhost:4200/vendor.js:33782:43
runTask@http://localhost:4200/polyfills.js:2504:57
drainMicroTaskQueue@http://localhost:4200/polyfills.js:2911:42
promiseReactionJob@[native code]
	defaultErrorLogger (vendor.js:31321)
	handleError (vendor.js:31370)
	next (vendor.js:34456:105)
	(anonymous function) (vendor.js:33441)
	__tryOrUnsub (vendor.js:59361)
	next (vendor.js:59299)
	_next (vendor.js:59237)
	next (vendor.js:59201)
	next (vendor.js:58916)
	emit (vendor.js:33433)
	run (polyfills.js:2454)
	onHandleError (vendor.js:33813)
	runGuarded (polyfills.js:2470)
	_loop_1 (polyfills.js:2993)
	microtaskDrainDone (polyfills.js:3002)
	drainMicroTaskQueue (polyfills.js:2918)
	promiseReactionJob

Have something very similar, but i'm still on CLI v1.7.3

I have the same problem using ng build --prod and ng serve --prod running latest Angular CLI: 6.1.2.
Is there any update on the issue?

same issue, darn :(

Hello, is any solution?

I meet this problem,too.anybody help?thx.

I am hitting the same problem. Whichever way we chose to lazy load the children routes, either the production build (ng build --prod) or development (ng serve) build breaks.

Any update ?

If I turn AOT off in Prod this should go away (as a temp solution), right?

Same issue here :(

Same issue on v. 7.2.12

Same issue on v. 7.3.9

use:  { path: '', loadChildren: '../../page/home/home.module#HomeModule' }
instead of { path: '',  loadChildren: () => HomeModule  }
run:
ng build --prod --aot=true --build--optimizer=true

I've started getting this error since updating to Angular 8, I'm using the new method for loadchildren i.e
      {
        path: 'custom',
        loadChildren: () =>
          import('./custom/custom.module').then(m => m.CustomModule)
      },

but I'm only getting the error on Angular Universal side, if I navigate to that route after the app has loaded it loads without issue. It's also only happening on one module. What is also confusing is that if I build and run locally I don't have the issue it's only when a deploy to kubernetes that I get the issue so not sure if I'm missing something in my docker build.

@dottodot did you found a solution ?
I have the same problem here, since migrating to Angular 8.
The CLI change the way to write lazy routes but now I have this error.

@C0ZEN Yes I used the index option i.e
 "index": "projects/client/src/index-prod.html",

and then to use the correct file in angular universal I just setup an environment variable
const indexFile = process.env.INDEX_FILE;

@dottodot thanks for the answer.
However I am not sure that your problem was exactly the same as mine.
How did I solve this problem:
Angular 8 change the way to write loadChildren when using the command ng update and sadly, converted to a JIT only compatible syntax (a.k: the arrow function instead of the string syntax).
I managed to make it works once again in AOT by using the old - soon to be deprecated ? - string syntax .

@C0ZEN sorry have a few issues going on at the moment and though it was a different one so0 ignore that. No I've not found a solution as yet.

@dottodot as I said, I found a temporary solution by using the string syntax.
Did you try it ?
Example:
from:
loadChildren: () => import('./customer/customer.module').then(pageModule => pageModule.CustomerModule),
to:
loadChildren: './customer/customr.module#CustomerModule'

@C0ZEN yes the old syntax works ok so will have to use that until I can find out why it's happening. Just seem odd that's it's only one module not all. Is it the same for you?

@dottodot all modules are broken. It seems like anything at all has changed after the upgrade to Angular 8.

[
  { provide: COMPILER_OPTIONS, useValue: compilerOptions, multi: true },
  { provide: CompilerFactory, useClass: JitCompilerFactory, deps: [COMPILER_OPTIONS] },
  { provide: Compiler, useFactory: createCompiler, deps: [CompilerFactory] }
]

JitCompilerFactory still goes wrong when works with lazy loading in angular 7 and 8
@filipesilva @mgechev

@dottodot @C0ZEN I'm not sure if the problem you are describing is the same as the original one described in this issue. The original issue was about error messages when using an unsupported syntax (like loadChildren: () => ComponentName, without import(), which we don't support). It wasn't related to Universal, but it seems like yours is. Can you open a new issue please with a reproduction that we can follow and debug?
@vthinkxie we haven't fixed the error messages for the original issue described here, so you should still get the same error message if you follow the reproduction provided. I think your issue might be different, even though the error message is the same, since it has different configuration options. Can you open a new issue with a reproduction as well please?

Hi @filipesilva
I double check it and found it works in angular 8 now, but still got errors when trying to enable ivy
here is the issue with repro link, thanks a lot
https://github.com/angular/angular/issues/30862

Cool, glad to hear. I'll keep an eye on the issue you linked to see if there's anything we need to do on the CLI side of things.

@filipesilva  I ended up repeating the migration process and now it works, so there must have been something wrong in the first attempt, unfortunately I've no idea what it was to provide any useful feedback.

I'm having this issue now. I'm getting ERROR Error: Uncaught (in promise): Error: Runtime compiler is not loaded using the new syntax with import. Should I try and scrap my migration and start over? At this point I'm considering using the old string syntax just to find out if it can make things work.

angular-cli version is 8.0.2, change lazy load to traditional way works for me.
{
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.800.2",
    "@angular/cli": "~8.0.2"
  }
}

    {
        path: 'tracks',
-       loadChildren: () => {
-           return import('./tracks/tracks.module').then(m => m.TracksModule);
-       },
+      loadChildren: './tracks/tracks.module#TracksModule',
        canLoad: [XsrfGuard, AuthGuard],
        canActivate: [AuthGuard],
        data: { }
    }

Same issue on v8.0.1

I solved the problem.my pre-resolution environment is angular version 7.2.15 and node version 8.12.0.
solve method：
First, update angular 7.2.15 to 8.0.3 ，node 8.12.0 to 10.16.0

Second, change loadChildren syntax as follows:

It seems that the PR #31146 fix this problem.

Hi,
same issue on 8.1.0.
Only on lazy loaded modules that contains other lazy loaded modules and a <router-outlet> tag.
The traditional lazy load synthax works.
Here is a github repo to show the issue : https://github.com/mbrechet/ng8-lazyload
The stackblitz link is here https://stackblitz.com/github/mbrechet/ng8-lazyload
Note : to reproduce the problem you must build or serve angular in production mode and click on account link.
Here the stacktrace error :

@dottodot @C0ZEN I faced the same issue but my problem was in the code
{
path: 'target',
loadChildren: () => import('./target/target.module').then((m => m.TargetModule))
},
so i removed the repeated parenthesis
loadChildren: () => import('./target/target.module').then(m => m.TargetModule)

@mbrechet did you ever figure this out? I'm running into the same problem.

I figured mine out. I just threw away my changes and tried again from scratch. Didn't happen again. Someone else offered this advice on this thread and it worked for me. The update process isn't quite stable I suppose.

Hi,
same issue on 8.1.0.
Only on lazy loaded modules that contains other lazy loaded modules and a <router-outlet> tag.
The traditional lazy load synthax works.
Here is a github repo to show the issue : https://github.com/mbrechet/ng8-lazyload
The stackblitz link is here https://stackblitz.com/github/mbrechet/ng8-lazyload
Note : to reproduce the problem you must build or serve angular in production mode and click on account link.
Here the stacktrace error :

@mbrechet I was able to solve this issue by downgrading all of my angular packages to ^8.0.0 and setting "@angular-devkit/build-angular": "~0.801.1"

Hi,
@JWTappert  With the last version of angular
    "@angular-devkit/build-angular": "~0.802.1",
    "@angular/cli": "~8.2.1",

And without using async await synthax it works now for me.
I've updated my demo on github if you want to test : https://github.com/mbrechet/ng8-lazyload

It seems like the problem is that the transplier is not handling a multiline format of the arrow function.
This does not work:
{
path: 'custom',
loadChildren: () => {
return import('./custom/custom.module').then(m => m.CustomModule);
}
}
But This does work:
{
path: 'custom',
loadChildren: () => import('./custom/custom.module').then(m => m.CustomModule)
}
When changing the function to a single line it works with the Angular 8

It seems like the problem is that the transplier is not handling a multiline format of the arrow function.
This does not work:
{
path: 'custom',
loadChildren: () => {
return import('./custom/custom.module').then(m => m.CustomModule);
}
}
But This does work:
{
path: 'custom',
loadChildren: () => import('./custom/custom.module').then(m => m.CustomModule)
}
When changing the function to a single line it works with the Angular 8

Funny, this actually worked for me too.

Mine was using the template tag ` instead of '.
It seems this definition is very very sensitive
Doesn't work:

loadChildren: () => import(`./home/home.module`).then(m => m.HomeModule)

Works:

loadChildren: () => import('./home/home.module').then(m => m.HomeModule)

@cesee  I faced the same issue and your solution worked for me as well.
`Angular CLI: 8.3.2
Node: 12.9.1
OS: darwin x64
Angular: 8.2.4
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package                            Version
@angular-devkit/architect          0.803.2
@angular-devkit/build-angular      0.803.2
@angular-devkit/build-optimizer    0.803.2
@angular-devkit/build-webpack      0.803.2
@angular-devkit/core               8.3.2
@angular-devkit/schematics         8.3.2
@angular/cdk                       8.1.4
@angular/cli                       8.3.2
@angular/fire                      5.2.1
@angular/flex-layout               8.0.0-beta.27
@angular/material                  8.1.4
@angular/material-moment-adapter   8.1.4
@ngtools/webpack                   8.3.2
@schematics/angular                8.3.2
@schematics/update                 0.803.2
rxjs                               6.5.2
typescript                         3.5.3
webpack                            4.39.2`

I did the same as above but it did not work for me :(
I really like the new way of lazy loading modules with import but that doesn't seem to work. I removed the template tag and replaceed with ' . Also removed the line breaks, but it did not work
Only reverting back to old style of laxy loading worked for me.
 {
    path: 'login',
    loadChildren: './modules/login/login.module#LoginModule'
  },
  {
    path: 'feedback',
    loadChildren: './modules/feedback/feedback.module#FeedbackModule',
    canLoad: [AuthenticateGuard]
  },

@jshifrin25 I can't believe it, but this actually did it!! Thanks!

I had the same problem. The solution was:
  {
    path: 'categorias',
    loadChildren: './categorias/categorias.module#CategoriasModule'
  }

This does not work:
  {
    path: 'categorias',
    loadChildren: () => import('./categorias/categorias.module').then(m => m.CategoriasModule)
  }

It was necessary to change the version of the dependency:
"@angular-devkit/build-angular": "^0.13.0",

Thanks for reporting this issue. This issue is now obsolete due to changes in the recent releases. Please update to the most recent Angular CLI version.
If the problem persists after upgrading, please open a new issue, provide a simple repository reproducing the problem, and describe the difference between the expected and current behavior.

authors: Arxero Aw3same C0ZEN JWTappert Lidya164 Muzammil-Bilwani aaronfrost alan-agius4 amreshprasad basettoni89 beginor carl-parrish cesee doovers dottodot evandrofuhr filipesilva huannguyenfit jamra jarddel jshifrin25 jz9423 leonelngande mbrechet mehmet-erim saturnino scipper tyurin-ilya vijayakumar-psg587 vinagreti vthinkxie wyy0117 yornel13

repo: angular/angular-cli


text:
Add universal option to ng new

🚀 Feature request
Add on universal option on ng new schematic to allow creation of new application with universal features.
Command (mark with an x)
- [x] new
- [ ] build
- [ ] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Description
Allow generation of basic universal app through ng new schematic.
Describe the solution you'd like
New ng new option 'universal' boolean default false that would run ng universal schematic if set to true on application creation.
Describe alternatives you've considered
Alternative is to run it separately as it is now. Maybe there is a reason for it that I am not foreseeing.
add-on
I would very much like to contribute and give a try of setting this up myself :)

Hi @Fufuxx, thanks for your interest in this and the PR.
Yesterday, we discussed this during our meeting and we think it's best not to add this feature because the universal schematic alone doesn't generate a working universal application, since it will not generate any server code that is needed to serve the SSR'd application.
Typically users shouldn't use this schematic to generate a working Universal application but rather do it via ng add @nguniversal/express-engine or ng add @nguniversal/hapi-engine.
Docs: https://angular.io/guide/universal
The universal schematic is used for other use cases, such as; App Shell, and the the above ng add packages uses this as part of their code generation.
Thanks for your understanding.

source: gharchive/issue

license: MIT

license_type: permissive

license_source: github-api


text:
Opacity resolves to 1% in production build

🐞 bug report
Affected Package

 I am not sure but I guess somewhere in the build process.
Is this a regression?

 Yes, the previous version in which this bug was not present was: 8.3.26
Description
 When building the application in production mode an element with an opacity of 95% is rendered as one with an opacity of 1%. In dev mode the opacity remains 95%. This happens when using scss for styling.
🔬 Minimal Reproduction

 https://stackblitz.com/edit/angular-issue-repro2-iglae5?file=src%2Findex.html

🔥 Exception or Error

 No warnings or errors are logged or shown.

🌍  Your Environment
Angular Version:

Angular CLI: 9.1.1
Node: 12.8.1
OS: win32 x64

Angular: 9.1.1
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.901.1
@angular-devkit/build-angular     0.901.1
@angular-devkit/build-optimizer   0.901.1
@angular-devkit/build-webpack     0.901.1
@angular-devkit/core              9.1.1
@angular-devkit/schematics        9.1.1
@ngtools/webpack                  9.1.1
@schematics/angular               9.1.1
@schematics/update                0.901.1
rxjs                              6.5.5
typescript                        3.8.3
webpack                           4.42.0

Also on:

Angular CLI: 9.0.7
Node: 12.8.1
OS: win32 x64

Angular: 9.0.7
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.900.7
@angular-devkit/build-angular      0.900.7
@angular-devkit/build-ng-packagr   0.900.7
@angular-devkit/build-optimizer    0.900.7
@angular-devkit/build-webpack      0.900.7
@angular-devkit/core               9.0.7
@angular-devkit/schematics         9.0.7
@angular/cdk                       9.1.3
@angular/material                  9.1.3
@ngtools/webpack                   9.0.7
@schematics/angular                9.0.7
@schematics/update                 0.900.7
ng-packagr                         9.0.3
rxjs                               6.5.4
typescript                         3.7.5
webpack                            4.42.1

Anything else relevant?

Hi @mrVanderWel,
On production build the css optimiser (cssnano) is rounding up the number to 1, which isn't correct. Since 95% is a valid value as per https://developer.mozilla.org/en-US/docs/Web/CSS/opacity
Please contact the author(s) of the cssnano project or file an issue on their issue tracker.


text:
Module parse failed: Unexpected token by library containing .svg file

Command
build, serve
Is this a regression?

[ ] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was
No response
Description
Hello,
I'm currently facing an issue where one of the libraries we use in the project contains a .svg file which currently prevents angular from starting the local server or building
The error we see is:
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <?xml version="1.0" encoding="UTF-8"?><svg id="Ebene_3" xmlns="http://www.w3.org/

I havent been able to add a custom webpack config yet - any pointers would be appreciated.
Currently the angular config is using "builder": "@angular-devkit/build-angular:browser",
Is there a built-in way to ignore e.g. svg from being processed? Or a way to add a file handler?
Minimal Reproduction

install @needle-tools/engine or any npm package containing a .svg file
run ng serve in the project (see env below)

make sure to import the library in one of your files
Repo: https://github.com/luixxma/angular-needle
Exception or Error
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <?xml version="1.0" encoding="UTF-8"?><svg id="Ebene_3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 160 187.74"><defs><style>.cls-1{fill:url(#Unbenannter_Verlauf_122);}.cls-2{fill:#f3e600;}.cls-3{fill:url(#Unbenannter_Verlauf_113);}.cls-4{fill:url(#gradient-6);}.cls-5{fill:url(#Unbenannter_Verlauf_110);}.cls-6{fill:url(#Unbenannter_Verlauf_101);}.cls-7{fill:#9c3;}.cls-8{fill:#ffe1

Your Environment
Angular CLI: 16.0.1
Node: 16.16.0
Package Manager: npm 8.19.2
OS: win32 x64

Angular: 16.0.1
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, material, platform-browser, platform-browser-dynamic
... platform-server, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1600.1
@angular-devkit/build-angular   16.0.1
@angular-devkit/core            16.0.1
@angular-devkit/schematics      16.0.1
@nguniversal/builders           16.0.2
@schematics/angular             16.0.1
rxjs                            7.8.1
typescript                      4.9.5

The mentioned library is importing the SVG like a ECMA module. This is Webpack specific behaviour which is not supported and not intended to work.
import _logo from "./logo.svg"
export const logoSVG = _logo;

Closing as the failure is correct here and by design.

Hello @alan-agius4 thanks for the fast reply. Do you have any information why it works in webpack 5 when running in a next.js context?
Do you have information about how to modify the webpack.config for angular-cli projects?

Fixed by embedding the svg string instead of importing it

Do you have any information why it may work in webpack 5 when running in a next.js context?

Probably next.js allows using Webpack specific feature.

How do you recommend asset files inside packages should be loaded/handled?

This is an issue with the library I suggest to file an issue with them. Inlining the SVG is a good solution.

Do you have information about how to modify the webpack.config for angular-cli projects?

You can use 3rd party builders like ngx-build-plus. Note that using custom builders or custom webpack configuration are not supported by the Angular team. The fact that currently the CLI uses Webpack by default is an implementation detail and it will change in the future.

Yes next.js exposes the webpack config and you can modify it as you'd wish.
How would you recommend to transform code when building an Angular app or adding loader plugin? Does Angular provide an API for that which is decoupled from the bundler being used?
From reading and searching I've came across this reply a few times and I wonder why you dont expose it and if you ever switch the bundler in a major release then people would have to adjust their projects IF they chose to make "lower-level" adjustments? Perhaps you could also add a warning when someone does this?


text:
serve fails complaining app/app.component.ts is missing from TypeScript compilation

Which @angular/* package(s) are the source of the bug?
core
Is this a regression?
Yes
Description
What I did so far:

npm i -g @angular/cli@latest
ng new ng-upskill-app
Removed the HTML in app.component.html (left the router-outlet only)
Added the control flow blocks a shown in the image.
saw the errors

I can't reproduce this again 🙁
Please provide a link to a minimal reproduction of the bug
No response
Please provide the exception or error you saw
> ng-upskill-app@0.0.0 start
> ng serve

Initial Chunk Files | Names         |  Raw Size
polyfills.js        | polyfills     |  82.71 kB |
main.js             | main          |  23.47 kB |
styles.css          | styles        |  96 bytes |

                    | Initial Total | 106.28 kB

Application bundle generation complete. [3.385 seconds]
Watch mode enabled. Watching for file changes...
  ➜  Local:   http://localhost:4200/

Initial Chunk Files | Names | Raw Size
main.js             | main  | 23.50 kB |

Unchanged output files: 2
Application bundle generation complete. [0.513 seconds]
Reloading client(s)...

Initial Chunk Files | Names | Raw Size
main.js             | main  |  2.14 kB |

Unchanged output files: 2
Application bundle generation complete. [0.201 seconds]
Reloading client(s)...
✘ [ERROR] File 'src/app/app.component.ts' is missing from the TypeScript compilation. [plugin angular-compiler]

    src/main.server.ts:2:29:
      2 │ import { AppComponent } from './app/app.component';
        ╵                              ~~~~~~~~~~~~~~~~~~~~~

  Ensure the file is part of the TypeScript program via the 'files' or 'include' property.

Application bundle generation failed. [0.165 seconds]
✘ [ERROR] File 'src/app/app.component.ts' is missing from the TypeScript compilation. [plugin angular-compiler]

    src/main.server.ts:2:29:
      2 │ import { AppComponent } from './app/app.component';
        ╵                              ~~~~~~~~~~~~~~~~~~~~~

  Ensure the file is part of the TypeScript program via the 'files' or 'include' property.

Please provide the environment you discovered this bug in (run ng version)
Angular CLI: 17.0.0
Node: 18.17.0
Package Manager: npm 9.6.7
OS: darwin arm64

Angular: 17.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, platform-server
... router, ssr

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1700.0
@angular-devkit/build-angular   17.0.0
@angular-devkit/core            17.0.0
@angular-devkit/schematics      17.0.0
@schematics/angular             17.0.0
rxjs                            7.8.1
typescript                      5.2.2
zone.js                         0.14.2

Anything else?
No response

Unfortunately, we are unable to reproduce the problem as described.
If possible can you provide a minimal reproduction that demonstrates the problem?

In my project that error happens on a regular basis.
Here's the link: https://github.com/rainerhahnekamp/angular-local-change-detection.
Just make some syntax errors in the template, and the message will show up.
Two things that might be of interest:

I use Tailwind
WebStorm saves the file whenever I switch the window (and I do that quite often).

Anyone that did not see this happening isn't programming with v17. It happens all the time.

@toddhd , I saw this in this link:
I finally found a solution, and did open a ticket with the Angular team about it. I honestly can't tell you why it ever worked, or why it works for most people and not others, however, I can tell you what fixed it. Another user on the Angular support forums tried this fix as well and confirmed it worked for them as well.
Go into the angular.json file, and add a "preserveSymlinks": true as indicated below:
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:application",
"options": {
"preserveSymlinks": true,
    It works for me.

    Here's the link: https://stackoverflow.com/questions/77495707/angular-17-giving-me-a-main-ts-missing-error-and-i-cant-fix-it

I'm also having the same issue. "preserveSymlinks": true did not help for me. I had it a few times the last few days, but today I have it with each save of a file. When I update template files it does not recognize any change at all.
I just realized that when I save a ts file without changing anything the compiler complains. If I put an empty line into it, it fixes itself. But its having every time.

I'm facing the same issue. After updating Angular to version 17.0.4 and changing the builder to @angular-devkit/build-angular:application everything went smoothly until suddenly it started to throw the error:
Changes detected. Rebuilding...✘ [ERROR] File ... is missing from the TypeScript compilation. [plugin angular-compiler]

"preserveSymlinks": true didn't solve the problem
For a few minutes after the update, it was working fine.
The application is building correctly with ng build.

I've solved the problem by removing the option "aot": false,  from angular.json
{
 ...
  "architect": {
      "build": {
          "builder": "@angular-devkit/build-angular:application",
          "options": {
            "outputPath": "dist",
            "index": "src/index.html",
            "browser": "src/main.ts",
            "tsConfig": "tsconfig.app.json",
            // "aot": false, <- needs to be removed
            ...
      }
     ...

That helped, thanks.

If you are still encountering issues with the latest version, please provide the full output of ng version and if possible a minimal reproduction in a new issue.  Also please ensure that all the Angular packages have been updated. The majority of the build system is in the @angular-devkit/build-angular package.  The OS being used is also highly relevant (and the shell if on Windows) and will help the team troubleshoot more effectively.

I've just upgraded to v17 and  "builder": "@angular-devkit/build-angular:application" and started getting this error when editing something.
I had "aot": false in dev build and just like @jacekkoziol suggested, removing it fixed the issue.

Hi @MasonVX, I am unable to replicate the problems with the steps provided using MacOS. Do you have any special characters in the path or some upper case characters?

Hi @MasonVX, I am unable to replicate the problems with the steps provided using MacOS. Do you have any special characters in the path or some upper case characters?

The path I created the app in:
~/Development/test/testApp
And as I said, the only thing I changed for the starter project is set aot to false:

@MasonVX, I am still unable to replicate this when aot is disabled.
{
  "projects": {
    "ng-new-test": {
      "projectType": "application",
      "root": "",
      "sourceRoot": "src",
      "prefix": "app",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:application",
          "options": {
            "outputPath": "dist/ng-new-test",
            "aot": false,

$ ng v

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 17.0.5
Node: 18.19.0
Package Manager: npm 10.2.3
OS: darwin arm64

Angular: 17.0.5
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, platform-server
... router, ssr

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1700.5
@angular-devkit/build-angular   17.0.5
@angular-devkit/core            17.0.5
@angular-devkit/schematics      17.0.5
@schematics/angular             17.0.5
rxjs                            7.8.1
typescript                      5.2.2
zone.js                         0.14.2

$ ng s

Initial Chunk Files | Names         |  Raw Size
polyfills.js        | polyfills     | 977.67 kB |
main.js             | main          |  21.82 kB |
styles.css          | styles        |  95 bytes |

                    | Initial Total | 999.59 kB

Application bundle generation complete. [1.322 seconds]
Watch mode enabled. Watching for file changes...
  ➜  Local:   http://localhost:4200/

Initial Chunk Files | Names | Raw Size
main.js             | main  | 21.83 kB |

Unchanged output files: 2
Application bundle generation complete. [0.070 seconds]
Page reload sent to client(s).

Initial Chunk Files | Names | Raw Size
main.js             | main  | 21.83 kB |

Unchanged output files: 2
Application bundle generation complete. [0.053 seconds]

Ok, I'm being honest, I have no idea what it could be. I even tried an update to npm v18.19.0 but it didn't help as well. I also deleted .angular and also node_modules.
I mean I'm not the only one. I could try to debug it myself, if you can give me a hint where to look, but I guess I would have to setup a whole Angular CLI dev environment.

I've solved the problem in my case by removing the option "aot": false, from angular.json
{
 ...
  "architect": {
      "build": {
          "builder": "@angular-devkit/build-angular:application",
          "options": {
            "outputPath": "dist",
            "index": "src/index.html",
            "browser": "src/main.ts",
            "tsConfig": "tsconfig.app.json",
            // "aot": false, <- needs to be removed
            ...
      }
     ...

i don't even have aot within my angular.json file , but still getting File 'src\app\app.component.ts' is missing from the TypeScript compilation. src/main.server.ts:2:29 Error after 6/7/8 saves.
-> Angular v17.0.0, node 20.9.0

I don't understand whi is this closed why is this closed... The aot is not a solution. This is happening to me and its become more and more annoying. I'll paste my setup:
 _                      _                 ____ _     ___
/ \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|

/ △ \ | '_ \ /  | | | | |/ _ | '__|   | |   | |    | |
/ ___ | | | | (| | || | | (| | |      | || | | |
//   __| ||_, |_,||_,||       _|||
|___/
Angular CLI: 17.0.6
Node: 20.10.0
Package Manager: npm 10.2.3
OS: win32 x64
Angular: 17.0.6
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, platform-server
... router, ssr
Package                         Version
@angular-devkit/architect       0.1700.6
@angular-devkit/build-angular   17.0.6
@angular-devkit/core            17.0.6
@angular-devkit/schematics      17.0.6
@schematics/angular             17.0.6
rxjs                            7.8.1
typescript                      5.2.2
zone.js                         0.14.2

@toddhd , I saw this in this link:
I finally found a solution, and did open a ticket with the Angular team about it. I honestly can't tell you why it ever worked, or why it works for most people and not others, however, I can tell you what fixed it. Another user on the Angular support forums tried this fix as well and confirmed it worked for them as well.
Go into the angular.json file, and add a "preserveSymlinks": true as indicated below:
"architect": { "build": { "builder": "@angular-devkit/build-angular:application", "options": { "preserveSymlinks": true,
    It works for me.

    Here's the link: https://stackoverflow.com/questions/77495707/angular-17-giving-me-a-main-ts-missing-error-and-i-cant-fix-it

he error you encountered suggests that the TypeScript compilation process could not find the main.ts file in your Angular project. The resolution involved using the preserveSymlinks: true option in the angular.json configuration. Let's break down why this option helped resolve the issue:
Symlinks and Project Structure:
It's possible that your project uses symbolic links (symlinks) for organizing files or directories, and the main.ts file might be part of a symlinked structure. When Angular CLI runs the TypeScript compiler, it follows the links and expects to find the TypeScript files in the specified locations.
preserveSymlinks: true:
By setting preserveSymlinks: true in the angular.json file, you instructed the Angular CLI to preserve the symbolic links during the build process. This means that when the TypeScript compiler looks for files, it respects the symbolic links and includes the files that are part of the symlinked structure.
TypeScript Compilation Process:
The TypeScript compiler (tsc) is responsible for compiling TypeScript code into JavaScript. When building an Angular project, the Angular CLI uses tsc under the hood. If the compilation process encounters symlinked files and doesn't preserve symlinks, it might miss files or encounter unexpected issues.
angular.json Configuration:
The angular.json file contains the configuration for your Angular project, including build settings. The preserveSymlinks: true option is part of this configuration and affects how the build process handles symbolic links.

authors: AhsanAyaz AjChaudhary00 Jose1Useche MasonVX Mehedihasan-95 TinyDinosaur alan-agius4 clydin elgerm jacekkoziol rainerhahnekamp zlatanov


text:
Angular 17 does not reflect style changes in a library to example app in same project

Which @angular/* package(s) are the source of the bug?
Don't known / other
Is this a regression?
Yes
Description
I am currently developing a chat library and tried to build a local app for fast development. I follwed a tutorial (link and everything is doing well. But when I try to add changes to a stylesheet I don't see the changes in my example project.
E.g. I add flex-grow: 1; in a component in the lib the lib will be built (because I started it in a terminal window with ng build --watch --> I can see the rebuild) but the style changes aren't reflecting in the example project. Only with npm install also the new added styles are available.
Please provide a link to a minimal reproduction of the bug
Example
Please provide the exception or error you saw
I have two terminals startet. In the first I run ng build test --watch to build the lib on hotfixes and the second where I run normal ng serve with the test application within the same project. When I try to update styles in test.component.scss I will never see these new added styles until I make a fresh install of the lib in the app (with npm install)
Please provide the environment you discovered this bug in (run ng version)
Angular CLI: 17.0.3
Node: 18.17.0
Package Manager: npm 9.6.7
OS: win32 x64

Angular: 17.0.4
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1700.3
@angular-devkit/build-angular   17.0.3
@angular-devkit/core            17.0.3
@angular-devkit/schematics      17.0.3
@angular/cdk                    17.0.1
@angular/cli                    17.0.3
@angular/material               17.0.1
@schematics/angular             17.0.3
ng-packagr                      17.0.2
rxjs                            7.8.1
typescript                      5.2.2
zone.js                         0.14.2

Anything else?
No response

@alan-agius4  I have added a sample project and also my observations. I hope that can help.


text:
environment variables no longer added to main.js with application build

Command
build
Is this a regression?

[X] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was
No response
Description
After upgrading to angular 18 and the new build system, the output main.js file no longer contains environment variables.
My environment.prod.ts file looks like this:
export const environment = {
production: true,
aadClientId: '{#Config:Op.Front.MyApp:AzureAd:ClientId#}',
// more variables here
}
and the deployment pipeline in azure would search in main.xxx.js to replace placeholders with appropriate values based on environment (dev, staging, prod)
however with the new angular build system, the generated main file ( for example browser/main-Y276RYOS.js')  no longer contains the placeholder.
Why is that ? Is there a way to keep the old behavior ? Otherwise my deployment pipeline in azure just doesn't work anymore and I'm not sure how to refactor this ..
Minimal Reproduction
steps are described above in description
Exception or Error
No response
Your Environment
Angular CLI: 18.0.4
Node: 20.11.1
Package Manager: npm 10.2.4
OS: win32 x64

Angular: 18.0.3
... animations, cdk, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1800.4
@angular-devkit/build-angular   18.0.4
@angular-devkit/core            18.0.4
@angular-devkit/schematics      18.0.4
@angular/cli                    18.0.4
@schematics/angular             18.0.4
ng-packagr                      18.0.0
rxjs                            7.8.1
typescript                      5.4.5
zone.js                         0.14.2

Anything else relevant?
No response

Hi @graphicsxp, file replacements still work the same way. Could you please share your angular.json file?

Hello.  Sure, here it is
angular.json
I have not changed anything about fileReplacements. As you can see only parts related to new builder were changed automatically during upgrade.

This should work. Can you setup a minimal repro please?
You can read here why this is needed. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

I can try but that's not easy. Did you see my angular.json ?  It's an angular workspace made of several app/libraries.....
Before that, could you at least tell me where the content of environment.prod.ts is going after build run ?  Used to be in main.xxx.js but what about now with the new build ?

Before that, could you at least tell me where the content of environment.prod.ts is going after build run ? Used to be in main.xxx.js but what about now with the new build ?

It depends on the usage, if it is used in multiple chunks, it can be located in a shared bundle (chunk-xxxx.js)

It depends on the usage, if it is used in multiple chunks, it can be located in a shared bundle (chunk-xxxx.js)
right. with webpack the content of the environment file was always in main.xxx.js.  So I'll have to find out in which file it is and adapt my azure pipeline to replace tokens in that file instead. I had a quick look last night but I didn't see it in other files, I will loook again.

@alan-agius4 , you were right !  I found my environment placeholders in one of the chunk file. I'll update my pipeline accordingly.
Thanks a lot !


text:
npm linked version of angular-cli returns error when generating a new project

Please provide us with the following information:

OS?
OSX 10.12
Versions.

Please run ng --version. If there's nothing outputted, please run in a Terminal: node --version and paste the result here:
angular-cli: local (v1.0.0-beta.19, branch: master)
node: 6.3.1
os: darwin x64

Repro steps.

git clone https://github.com/angular/angular-cli.git
cd angular-cli
npm link
ng new foo >> this is where the error happens

The log given by the failure.

Normally this include a stack trace and some more information.

npm ERR! Darwin 16.0.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "install"
npm ERR! node v6.3.1
npm ERR! npm  v3.10.3
npm ERR! No compatible version found: angular-cli@1.0.0-beta.19
npm ERR! Valid install targets:
npm ERR! 1.0.0-beta.2-mobile.4, 1.0.0-beta.2-mobile.3, 1.0.0-beta.2-mobile.2, 1.0.0-beta.2-mobile.1, 1.0.0-beta.2-mobile, 1.0.0-beta.19-3, 1.0.0-beta.12-1, 1.0.0-beta.11-webpack.9-4, 1.0.0-beta.11-webpack.9-3, 1.0.0-beta.11-webpack.9-2, 1.0.0-beta.11-webpack.9-1, 1.0.0-beta.11-webpack.9, 1.0.0-beta.11-webpack.8, 1.0.0-beta.11-webpack.7, 1.0.0-beta.11-webpack.6, 1.0.0-beta.11-webpack.5, 1.0.0-beta.11-webpack.4, 1.0.0-beta.11-webpack.3, 1.0.0-beta.11-webpack.2, 1.0.0-beta.11-webpack, 1.0.0-beta.18, 1.0.0-beta.17, 1.0.0-beta.16, 1.0.0-beta.15, 1.0.0-beta.14, 1.0.0-beta.12, 1.0.0-beta.10, 1.0.0-beta.9, 1.0.0-beta.8, 1.0.0-beta.6, 1.0.0-beta.5, 1.0.0-beta.4, 1.0.0-beta.1, 1.0.0-beta.0, 0.1.0, 0.0.39, 0.0.37, 0.0.34, 0.0.33, 0.0.31, 0.0.30, 0.0.29, 0.0.28, 0.0.27, 0.0.26, 0.0.25, 0.0.24, 0.0.23, 0.0.22, 0.0.20, 0.0.19, 0.0.18, 0.0.17, 0.0.16, 0.0.15, 0.0.14, 0.0.13, 0.0.12, 0.0.11, 0.0.10, 0.0.9, 0.0.8, 0.0.7, 0.0.6, 0.0.5, 0.0.4, 0.0.3, 0.0.2, 0.0.1, 0.0.0
npm ERR!
npm ERR!
npm ERR! If you need help, you may report this error at:
npm ERR!     https://github.com/npm/npm/issues
Mention any other details that might be useful.

Thanks! We'll be in touch soon.

+1 here.

Fixed in https://github.com/angular/angular-cli/pull/2992

authors: filipesilva sdiazvi seanrkerr


text:
ng --version reports wrong version number

After installing angular-cli to the latest, the --version command returns version 1.0.0-beta.30 instead of 1.0.0-rc.0
OS?
Windows 10
Versions.
This is what is at issue.
Repro steps.
npm uninstall -g @angular/cli
npm cache clean
npm install -g @angular/cli@latest
The log given by the failure.
-- @angular/cli@1.0.0-rc.0
  +-- @angular/compiler@2.4.8
  +-- @angular/compiler-cli@2.4.8
...
PS C:\Projects> ng --version
@angular/cli: 1.0.0-beta.30
node: 6.9.5
os: win32 x64

I just tried your reproduction steps and go the following:
development » ng -v
    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
@angular/cli: 1.0.0-rc.0
node: 6.9.5
os: darwin x64

Would you mind doing the following?
npm ls -g @angular/cli

Just recreated the issue on my home machine. I update my home machine from 1.0.0-beta.24, and after the update following the above steps, it still says that the version is 1.0.0-beta.24.
If I run the command you gave, I get the following:
C:\Users\bklik\AppData\Roaming\npm
-- @angular/cli@1.0.0-rc.0

Great, so globally you have rc.0 installed, as I had hoped.
Doing ng -v inside the directory of a project will return the local version of the CLI being used, no the global version. This includes folders that have a node_modules folder with the CLI installed in it.
Can you go outside any project directory (say C:\) and try ng -v?

Yes, I am doing this outside a project folder. But, just in case I did it at c:\ and got:
PS C:\> ng -v
angular-cli: 1.0.0-beta.24
node: 6.9.3
os: win32 x64
PS C:\>

It looks like you still have angular-cli installed. Try uninstalling angular-cli and @angular/cli, then reinstalling @angular/cli.
Shout out to @hansl for noticing.

I've done that already, but I'll do it again.

Even after running npm uninstall -g @angular/cli and npm uninstall -g angular-cli then reinstalling, I found that it still didn't work.
I tried an ng -v after uninstalling both, and surprisingly found that it would still output the beta version of angular-cli. I looked in the C:\Program Files\nodejs\node_modules and found a folder called angular-cli. After removing it, and re-installing angular-cli, angular-cli would fail to run afterward.
I gave up, uninstalled nodejs. Deleted C:\Program Files\nodejs and deleted all npm and npm-cache folders from my AppData. Reinstall nodejs, and ran npm install -g @angular/cli@latest.
I'm now properly receiving the correct version:
PS C:\WINDOWS\system32> ng -v
    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
@angular/cli: 1.0.0-rc.0
node: 6.10.0
os: win32 x64

Not a real work around. I think the answer lies in where that 'angular-cli' folder in 'nodejs/node_modules' came from, and how to properly remove it.

@bklik I know there are cases in windows where npm global installs get out of sync and it really sucks to figure out where the leftover modules are. I think it might be related to nvm.
It's not a CLI issue though... the CLI can't really control that sort of stuff. So in that sense it's not something I want to leave open in this issue tracker.

authors: bklik delasteve filipesilva


text:
ng build with --build-optimizer bugs

Bug Report or Feature Request (mark with an x)
- [x] bug report -> please search issues before submitting
- [ ] feature request

Versions.

macOS Sierra 10.12.6

node: 8.4.0
npm: 5.3.0
angular-cli: 1.3.1

When use ng build with --prod and --build-optimizer flag, it can not separate vendor chunk from the main chunk, it must use --vendor-chunk explicitly. But this build bigger chunk.

Disabling the vendor chunk is intentional as it allows further optimization.  The example above demonstrates the benefit (~200KB saved).

@clydin Thank you!  Please update the doc as soon as possible to explain this.

While we are at it. Wiki on build switch shows -bo is a valid alias, when as of 1.3.2 the only valid alias is --buildOptimizer.

Closing this issue...
@frostbtn FYI, that issue has been addressed in master and will be updated in the next release of the docs to the wiki.

It has been added to the wiki here https://github.com/angular/angular-cli/wiki/build#options

authors: Brocco clydin frostbtn johnpapa yokots


text:
test(@schematics/angular): test names typos

PR Checklist
Please check to confirm your PR fulfills the following requirements:

[x] The commit message follows our guidelines: https://github.com/angular/angular-cli/blob/main/CONTRIBUTING.md#-commit-message-guidelines
[ ] Tests for the changes have been added (for bug fixes / features)
[ ] Docs have been added / updated (for bug fixes / features)

PR Type
What kind of change does this PR introduce?

[ ] Bugfix
[ ] Feature
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[ ] Documentation content changes
[x] Other... Please describe: Test descriptions

What is the current behavior?
A test has a wrong description, and some have typos.
What is the new behavior?
Description and typos fixed.
Does this PR introduce a breaking change?

[ ] Yes
[x] No

@cexbrayat thanks for this.

source: gharchive/pull-request


text:
Can't use class attribute interpolation together with addClass

The element
<span class="prefix-{{foo}}"> {{bar}} </span>

should be given a class ng-binding, since it contains the binding 'bar'. However, this is not the case, as shown here: http://jsfiddle.net/5UyD2/1/

Why wasn't this marked as "type: bug"?

We've accepted (and documented) this as a known issue (which also affects directives like ngClass, ngStyle, etc).

authors: gkalpak juliemr thorn0


text:
Very slow bootstrapping of large templates in IE11

Issue
We recently started seeing very poor application loading performance in IE11. After some searching, we stumbled onto this Microsoft patch http://support.microsoft.com/kb/2962872 the timing of which coincides well with reports of slowness in our application. (Note in Issues there are known performance issues with the patch).
To reproduce: take a large-ish Angular template (say, 1MB) and attempt to bootstrap it (either automatically or manually).  If you are running without KB2962872 installed, you'll see that while it might take a few seconds (significantly longer than Chrome/Firefox/Safari), it will load in a somewhat reasonable amount of time. However, if you install KB2962872 (which should be happening automatically) you'll find that it often takes significantly longer, sometimes as much as 50-100 times longer than Chrome/Firefox/Safari -- seemingly too long for what it's doing.
See this simple example -- I see times of ~1-2s in "modern" browsers other than IE, and anywhere from 10s-90s in IE 11 (and sometimes IE 10, but I wasn't as able to pin that down).  The most frequent offender seems to be IE11 under Windows 7 and Windows 8.1, which almost always show really bad behavior in our testing. (We tried several VMs, via VirtualBox and Fusion, and a handful of physical machines).
Thoughts

First, even ignoring KB2962872, bootstrapping large templates in IE can be enough slower than other browsers that there may be something funny going on, and it might be worth investigating.
Second, once you throw KB2962872 into the mix (which all up-to-date installs of Windows 7 and Windows 8.1 at least should have) performance is so abysmal on large templates as to be unusable; while Microsoft has acknowledged that the patch has a performance regression it is probably worth trying to find a way to work around it anyway.

Unfortunately, I don't know enough about AngularJS internals to make immediate headway, but I'm willing to try if someone has a sense of where to begin.

Hi, currently I have a very subdole problem to solve with IE11 and AngularJS.
My page is consist of two nested ng-repeat to create a tabset with a table inside any tab.
Here the code: http://pastebin.com/0fffPz5Z
With a Chrome, Safari and Mozilla I have no problem, all is superfast! With IE11 the page go slow and IE11 show me the message of a too slow page's script....
I've created an IE11 interface's profiling with this result:
https://www.dropbox.com/s/y5xuystxht6gjkr/IE11-interface-profiling.png?dl=0
Is this another IE11's bug??? Sorry for my English and thanks in advance for any suggestion.

I am getting the same issue after adding bootstrap4.
IE slows down.

authors: FabrizioA LuckyAmanVerma zachsnow


text:
fix(ngAnimate): ensure anchored animations remove the leave element at the correct time

Due to a mismatch of where the options.domOperation value was stored,
the element involved in the leave animation for an anchored animation
session was not removed as soon as the leave animation ended. This
resulted in a pending element persisting within the DOM until all
animations involved in the associated anchor animation were complete.
This patch fixes this issue.
Closes #11850

LGTM

No test needed?

@Narretz The old test tested for this, but the mocking properties were incorrect.

Merged as https://github.com/angular/angular.js/commit/64c66d0eea11b575d2a71d00c70cfc5be12cd450

authors: Narretz matsko petebacondarwin


text:
fix($parse): do evaluate several times expressions with interceptors

For simple expressions without filters that need a stateless interceptor then handle the 2nd phase parse evaluation using inputs.
Closes #12983

Can you reword the commit message? I have a hard time understanding what it means.

@Narretz sure, done

LGTM - I think the LONG STORY from the issue should be included in the commit message.

authors: Narretz lgalfaso petebacondarwin


text:
the documentation only talks about insert but not update

the list observable provides api for add/remove.
But i could not find an api to do an update

We are working on adding those methods. Check out #41, #95, and #122.

authors: davideast rahulbats


text:
Docs still reference FirebaseObjectObservable

Please take a look at https://github.com/angular/angularfire2/blob/master/docs/rtdb/objects.md
It still references FirebaseObjectObservable and it would be helpful to have an example where, I assume, we now have an RxJs Observable. No? Thanks for a really useful package, but the transition to 5.0 has been a little rough.

Hey @SilverMountainSoftware I believe what we're experiencing is just a side-effect from how expansive the docs are and how much the library changed from 4.0 to 5.0. If you think you know how to fix the docs, the AF team is always happy to accept pull requests 👍
A number of us have been catching little things like this and fixing them, but again, there are a lot of docs and a lot of changes. We could use your help!

I encountered this same issue when forking an Ionic project.
Fixed this by editing my package.json which was referencing an outdated version of angularfire2. Changed it from "angularfire2": "2.0.0-beta.7" to "angularfire2": "2.0.0-beta.8".
Hope this works for you!


text:
Angular material resizable widgets

🚀 feature request
Relevant Package
This feature request is for @angular/material
Description
I am glad to see that Angular Material recently introduced drag and drop functionality. This feature was very instrumental in creating custom BI tools. One other feature that could significantly add the value is resizing the widgets. If this is added angular itself will provide an ecosystem to develop BI tools. I request Angular team to consider this request and introduce it in the upcoming builds.
Describe the solution you'd like
I believe we can keep a track on mouse click and mouse move events and alter the height and width of the element according to the mouse position.
Describe alternatives you've considered
At the moment, simplest alternative is to proceed with the JQuery tried and tested resizable plugins. But as Angular and JQuery not not a good mix for various. Keeping future in perspective, It would be better if this feature is comes built in the Material library itself.
Please, feel free to contact me for more info. Keep up the good work team. You guys are doing gods work 😄!

Should be covered by https://github.com/angular/components/issues/17440.

authors: IamTheLegend crisbeto

repo: angular/components


text:
bug(MATERIAL): material fab button does not resize with text

Reproduction
Use StackBlitz to reproduce your issue:

Components: https://stackblitz.com/fork/components-issue
Harnesses: https://stackblitz.com/fork/harness-issue

Steps to reproduce:

https://angular-material-idettd.stackblitz.io

Expected Behavior
What behavior were you expecting to see?
material - fab button does not resize depending on text
Actual Behavior
What behavior did you actually see?
Text overlaps / overflows button
Environment
Angular CLI: 12.1.0-next.3
Node: 12.21.0
Package Manager: npm 7.14.0
OS: linux x64
Angular: 12.1.0-next.3
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Package                         Version
@angular-devkit/architect       0.1201.0-next.3
@angular-devkit/build-angular   12.1.0-next.3
@angular-devkit/core            12.1.0-next.3
@angular-devkit/schematics      12.1.0-next.3
@angular/cdk                    12.0.2
@angular/flex-layout            12.0.0-beta.34
@angular/material               12.0.2
@schematics/angular             12.1.0-next.3
rxjs                            6.6.7
typescript                      4.2.4

Closing the issue, because the FAB isn't meant to show text according to the Material design spec.

authors: crisbeto kek-Sec


text:
docs-bug(material-experimental): Experimental by default

Documentation Feedback
I have been updating a page from Angular Material v16 to v17. During this process, all the components have been migrated as expected to the new UI, except for the mat-chip component.
Doing a lot of research I found that it was not an error. The mat-chip style was updated as expected, but the documentation for the Angular Material v17 is not showing the same styles.
Checking what was implemented on StackBlitz link that you find on the component overview, I found that the official Angular Material documentation is using the @angular/material-experimental library by default.
So the Angular Material documentation page, is showing all the styles based on the @angular/material-experimental library, which as you can find here, nothing in this package is considered stable or production ready.
So, my conclusions are the the official Angular Material documentation is showing all the component styles using and experimental library, when the Angular Material release is stable. If it's expected is ok to maintain it as this, but I would mention somewhere that what you are seeing is experimental.
This is happening from Angular Material v17 and above, and I think that is happening for all the components.
I checked on Angular Material v16, and the @angular/material-experimental library is not used to show the components on the documentation.
Thanks in advance! :)
Affected documentation page
https://v17.material.angular.io

The docs were updated to show M3, and at the time they were in experimental. But I agree if we do show something that is considered experimental there should be something to denote that. I'll move this issue do the docs repo. Thanks for the feedback!

authors: amysorto daleu


text:
docs-bug(treeview): Add guide on how to migrate from old treeview to new treeview

Documentation Feedback
Following the sudden deprecation of the various tree controllers, it would be nice if there were some kind of documentation on how to remove tree controller and migrate to the new way of doing things. Also, the documentation still contains references to treeControl, which it shouldn't because the treeControl has been deprecated?

A simple migration guide would be warranted as well because there are tonnes of search results and guides on how to use the tree that just became out of date, so if there was an easy way to adapt code to the new way of doing things, that would be ideal.
Affected documentation page
https://material.angular.io/components/tree/overview

Actually, the tree documentation page needs some attention overall it seems.
In the v17 documentation, the "Tree with flat nodes" appears correct.

But then, in v 18.2.10, it looks wrong.

"Tree with nested nodes (childrenAccessor)" looks to use the new children accessor functionality, but still uses tree.isExpanded, which I think is from the original deprecated treecontroller? So this example hasn't been fully migrated...

I think I'm reasonably good at the tree - I did an implementation for work and also wrote a fairly long article for LogRocket so I might be able to pop in a PR for these things, and fix other things (https://blog.logrocket.com/angular-tree-flat-vs-nested-and-more/).
Kind of not really related - I find the documentation for the treeview to be simultaneously overwhelming and light on details, almost like it's been built up over several years. This confusion is now only worse with the API documentation chopping and changing between the old treeControl implementation and the new childrenAccessor. People who were new to the tree would find the documentation very confusing in its current state. It's like the whole page needs to be redone. Would you accept a PR for this?

Just to help other people who might be trying to use async data in their trees: I figured it out. I tried a lot of things and in the end this is what stuck. My branch is here, I'm going to write about it soon with samples etc: https://github.com/azimuthdeveloper/angulartree/tree/inflight-changes-to-new-angular-tree
Basically,
For flat trees, use levelAccessor, and then on your node, use expandedChange to fire an event like handleNodeExpansion($event, node) where $event is the true/false state of whether the node is expanded or not, and node is the node that is being actuated. In that function, call your expand/contract function in the data source.
For nested trees, use childAccessor, and assign it to the children property of your node. It'll look like this. children must be of type Observable, so when they update, the tree updates. In my case, its a BehaviourSubject
  childrenAccessor = (dataNode: NestedTreeNode) => dataNode.children;
Again, then on your node, use expandedChange to fire an event like handleNodeExpansion($event, node) where $event is the true/false state of whether the node is expanded or not, and node is the node that is being actuated. In that function, call your expand/contract function in the data source.
On a more personal note, I think Angular has been going from strength to strength lately, and I wouldn't want to get on here and complain or say anything derogatory. Please accept this as constructive feedback.
At the time of me writing this, the tree control sample page is an unintelligible mess, chopping back and forth between the old treeControl and new childrenAccessor/levelAccessor. The documentation was very hard to understand in the first place and now it's just gotten worse. There are samples on how to use childrenAccessor, but no samples on how to use levelAccessor, so people are free to guess their way through an implementation like I did.
It's not clear why the tree was revamped - I couldn't find a long issue with comments that ended in "okay I'm going to deprecate large parts of the tree and make it work differently" so it's difficult to understand why this change was even made in the first place.
It would be nice if, when new features shipped, there was a better copy-edit process on the documentation, documentation didn't ship with todo notes, documentation was at least at feature parity with previous releases (like async loading of nodes), documentation at least covered all features (such as levelAccessor being absent) and some rationale was given as to why the change occured. I'm a strong Angular supporter, I write about it professionally and use it in my day job, so this comes from a place where I want Angular to succeed in the long run.


text:
fix(material/snack-bar): fix Firefox/JAWS not reading out snackbar me…

…ssage
Add role="alert" to snackbar container.
Known issue: JAWS does not read out aria-live region unless it has role="alert"
https://bugzilla.mozilla.org/show_bug.cgi?id=1453673
Fixes https://github.com/angular/components/issues/21137

cc @zelliott
I'm concerned this might have unintended consequences. One issue I see is that role="alert" is always treated as "assertive", which means they interrupt other content. I believe the default snackbar politeness should be "polite". Without testing I wouldn't know for sure, but I'd also wonder if having both aria-live and role="alert" would lead to double announcements.
The Firefox bug you point to also seems like the issue is somewhat inconsistent? It might be better to leave the snackbar as-is and leave this as a known Firefox + JAWS bug outside of our responsibility.

cc @zelliott
I'm concerned this might have unintended consequences. One issue I see is that role="alert" is always treated as "assertive", which means they interrupt other content. I believe the default snackbar politeness should be "polite". Without testing I wouldn't know for sure, but I'd also wonder if having both aria-live and role="alert" would lead to double announcements.
The Firefox bug you point to also seems like the issue is somewhat inconsistent? It might be better to leave the snackbar as-is and leave this as a known Firefox + JAWS bug outside of our responsibility.

cc @haywoodsloan as the resident snackbar expert I defer all snackbar questions to :)

cc @haywoodsloan as the resident snackbar expert I defer all snackbar questions to :)

When I worked on #20487 I switched the snackbar from using role="alert" or role="status" to aria-live="assertive" and aria-live="polite". When testing JAWS, NVDA, VoiceOver, and ChromeVox I found aria-live gave more consistent behavior between the SRs. I did most of that testing on Chrome though.
I wouldn't recommend setting role="alert" statically as that does imply aria-live="assertive" and could cause unexpected behavior if aria-live="polite" is explicitly set. Could consider setting role="alert" when aria-live="assertive" and role="status" when aria-live="polite". I haven't tested having both set myself, but have seen recommendations to use both for maximum compatibility.
The only report I've seen of setting both role and aria-live causing issues is here: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#preferring_specialized_live_region_roles. Potentially causing double speaking on VoiceOver on iOS, but that might be a fair tradeoff to support Firefox + JAWS better.

When I worked on #20487 I switched the snackbar from using role="alert" or role="status" to aria-live="assertive" and aria-live="polite". When testing JAWS, NVDA, VoiceOver, and ChromeVox I found aria-live gave more consistent behavior between the SRs. I did most of that testing on Chrome though.
I wouldn't recommend setting role="alert" statically as that does imply aria-live="assertive" and could cause unexpected behavior if aria-live="polite" is explicitly set. Could consider setting role="alert" when aria-live="assertive" and role="status" when aria-live="polite". I haven't tested having both set myself, but have seen recommendations to use both for maximum compatibility.
The only report I've seen of setting both role and aria-live causing issues is here: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#preferring_specialized_live_region_roles. Potentially causing double speaking on VoiceOver on iOS, but that might be a fair tradeoff to support Firefox + JAWS better.

We have precedent for only doing certain behaviors based on the platform (e.g. Firefox only) specifically for screen-reader issues like this. @annieyw we could explore using Platform to only add role="alert" or role="status" as appropriate for Firefox only.

We have precedent for only doing certain behaviors based on the platform (e.g. Firefox only) specifically for screen-reader issues like this. @annieyw we could explore using Platform to only add role="alert" or role="status" as appropriate for Firefox only.

Changed to only adding role for Firefox and added unit tests.

Changed to only adding role for Firefox and added unit tests.

Looks like the API gold needs to be updated

Looks like the API gold needs to be updated

authors: annieyw haywoodsloan jelbourn zelliott


text:
Show open/close behavior in sidenav README

The readme for sidenav should show opening / closing in its examples.

I work on this

authors: feloy jelbourn


text:
Md-Sidenav open mode bootstrap animation

Bug, feature request, or proposal:
Bug
What is the expected behavior?
When using universal, the sidenav (in side mode) will be rendered already open in the initial page load, and then when the app bootstraps, it will stay open.
What is the current behavior?
The initial pre-rendered page loads with the sidenav closed, and then when the app boostraps, the sidenav animates open.
What is the use-case or motivation for changing an existing behavior?
In beta 8, it worked perfectly. The initial pre-rendered html file aligned with the bootstrap re-render.
Now, the page loads with the sidenav closed, and after a number of seconds later (when the app bootstraps) the sidenav suddenly animates open, which is quite distracting.
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Angular 4.3.3, material 2.0.0-beta8, windows 10

I'd like to believe that the culprit here is a882546debb92bd9cf52937bf73eee8548d61bf0, which was for some reason left out of the CHANGELOG (this would also correspond to your timing that this worked in beta-8 and not beta-10 or beta-11).
Universal rendering doesn't support Angular Animations (yet), since it can't affect the document object (see https://github.com/angular/angular/issues/15098 and https://github.com/angular/angular/issues/14784). It looks like the beta-8 method relied exclusively on CSS-based animations, which would've rendered just fine.
cc @crisbeto @jelbourn Thoughts? (I.e. is it worth the tradeoff in perf/is there a workaround, and if not, is it worth the impact on UX for non-JS users who will never see the sidenav open?)

Might be duplicate of #7007, resolved by #7129

The problem here is actually deeper than anticipated. See here:
https://github.com/angular/material2/blob/20a23f16e8ac1ced29172709cc837fa500b6377b/src/lib/sidenav/drawer.ts#L347-L350
https://github.com/angular/material2/blob/20a23f16e8ac1ced29172709cc837fa500b6377b/src/lib/sidenav/drawer.ts#L553-L585
Since the margins for the mat-drawer-content depend on nativeElement, Universal can't possibly predict the width, leaving it static at 0, and populated on bootstrap on the client. The "animation" is really just the transition CSS firing once the width is populated.
@mmalerba Is there a possible refactoring we can do here, maybe by searching the element tree for CSS width if none other is available?

As documented in #7795, there's also an issue with transform: translate3d(0,0,0) not being applied correctly.

There's also currently an issue open https://github.com/angular/angular/issues/19235 that is tracking an issue with style.property not being applied correctly if the property name is in camelCase (in drawer, this is marginRight and marginLeft).

should be fixed by #8488

@mmalerba Issue not resolved by #8488

@crisbeto Still not fixed

Hi, any updates on this? In my case it was working OK with Angular 5.0.2 and material 5.0.0.rc0 but stop working when updated to Angular 5.2.8 and material 5.2.4

authors: CaerusKaru agustinhaller jsorr2 mmalerba


text:
Strange behaviour when a jasmine spec timeouts

I've been experiencing protractor strange behaviours when one spec timeouts. Specially when we have a beforeEach.
I have realized that:

After one 'it' timeouts, the following beforeEach will be ignored.
There is a sort of cascade effect that makes following specs also to timeout.

Code Example
protractor.conf.js
const DEFAULT_TIMEOUT_INTERVAL = 1000;

exports.config = {
    seleniumServerJar: './node_modules/protractor/selenium/selenium-server-standalone-2.47.1.jar',
    seleniumPort: 4455,

    suites: {
        'basic': 'spec.js'
    },

    capabilities: {
        'browserName': 'firefox'
    },

    framework: 'jasmine2',

    jasmineNodeOpts: {
        defaultTimeoutInterval: DEFAULT_TIMEOUT_INTERVAL,

    },

    onPrepare: function () {

    }

};

We set the timeout (defaultTimeoutInterval) to one second.
spec.js
describe('Testing domino effect (strange behavior) when Timeout', function () {

    beforeEach(function () {
        console.log('before spec finished!\n');
    });

    afterEach(function () {
        console.log('after spec finished!\n');
    });

    it('Test 1', function () {
        expect(1).toBe(1);
    });

    it('Test 2', function () {
        browser.get('http://www.protractortest.org/#/');
        browser.sleep(2000);
        expect(1).toBe(1);

    });

    it('Test 3', function () {
        expect(1).toBe(1);
    });

    it('Test 4', function () {
        expect(1).toBe(1);
    });

});

And we force the spec Test 2 to timeout by adding a 2 seconds sleep.
Given these tests the only test that should fail would be Test 2. However Test2, Test3 and Test4 will fail. The output after running the tests is the following:
Console Output
Starting selenium standalone server...
[launcher] Running 1 instances of WebDriver
Selenium standalone server started at http://192.168.4.105:4455/wd/hub
Started
before spec finished!

after spec finished!

.before spec finished!

after spec finished!

A Jasmine spec timed out. Resetting the WebDriver Control Flow.
Fafter spec finished!

A Jasmine spec timed out. Resetting the WebDriver Control Flow.
Fafter spec finished!

A Jasmine spec timed out. Resetting the WebDriver Control Flow.
F

Failures:
1) Testing domino effect in Timeout strange behavior Test 2
  Message:
    Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.
  Stack:
    Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.

2) Testing domino effect in Timeout strange behavior Test 3
  Message:
    Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.
  Stack:
    Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.

3) Testing domino effect in Timeout strange behavior Test 4
  Message:
    Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.
  Stack:
    Error: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.

4 specs, 3 failures
Finished in 3.029 seconds
Shutting down selenium standalone server.
[launcher] 0 instance(s) of WebDriver still running
[launcher] firefox #1 failed 3 test(s)
[launcher] overall: 3 failed spec(s)
[launcher] Process exited with error code 1

Protractor version: 2.5.1
Jasmine version: 2.3.2
I have a created a Gist so it is easier to reproduce the behaviour:
https://gist.github.com/lynchblue/1dd1f5d53a781ac1bce4

This is a duplicate of https://github.com/angular/protractor/issues/1797
Thanks for the gist and the detailed report, it should make investigating easier.

authors: juliemr lynchblue

repo: angular/protractor


text:
"More tasks executed then were scheduled" error when using zone.js and jquery.layout.

Please try to resize a window or hover on any resize pane:
http://plnkr.co/edit/coyaquV0zuwwVGLGAGUE?p=preview

+1 seeing same issues...

same issues in 0.12
More tasks executed then were scheduled.

Confirming, same issue in  0.6.6: http://plnkr.co/edit/XLXdc1EoEzOE7O4VoPQO?p=preview

@mhevery, Could you please re-open the issue?

+1
Same issue here

yes, it didn't help

this is a big showstopper for me...
I can't release ng 0.12 Kitchen sink: http://ng2.javascriptninja.io
due to this bug...
ng team, PLEASE remove the  Throw Exceptions in zone.js
Regards,
Sean

please re-open

I have a same bug, "More tasks executed then were scheduled." started to appear in my application that uses Semantic-UI for many components. Please re-open.

Same problem here. The "More tasks executed then were scheduled" message always appear when has interation with semantic-ui elements.

I'm using 2.0.0-beta.12 version.

This will show up in beta.13

OK, it seems like there as another issue with the same error message. Could someone please file a new issue with a plunker demonstrating the problem.

@mhevery - I think it is the same issue, this is using zone.js@0.6.6:
http://plnkr.co/edit/XrjNURLeN5bhPrkXnohG?p=preview

Also want to leave my input here that we are experiencing the same problem which is incredibly easy to reproduce. Just create a function that creates a timeout every 10 seconds that triggers itself.
Like is shown by @frankwallis example
It is a showstopper for us as well.

Same problem here with the spinner component;
http://www.primefaces.org/primeng/#/slider
Fails on beta12, after update from beta9.

Please see https://github.com/angular/zone.js/issues/302.

I get the "More tasks executed then were scheduled" on safari mobile.
I'm using ionic-angular@2.0.0-beta.3 and angular2@2.0.0-beta.12 with zone.js@0.6.8.
Can someone confirm that problem on safari mobile?

Remove angular2-polyfills and add zone and reflect-metadata with angular2-beta-13

...

 <script src="node_modules/reflect-metadata/Reflect.js"></script>
 <script src="node_modules/zone.js/dist/zone.js"></script>

...

Removing angular2-polyfills and adding zone and reflect as per @ourway worked (with semantic ui) for me also, but not until I'd updated zone.js to 0.6.8 (on zone.js 0.6.6 I was still getting the "More tasks executed then were scheduled" errors as per #302)

in my case upgrading the zone.js fixed the issue, but introduced a new one:
(angular2.0.0-beta.14, zone.js 0.6.8)
EXCEPTION: Error: Uncaught (in promise): false

Hey!
Awesome it is fixed for me after upgrading Angular to "2.0.0-beta.14" with zone "0.6.10" in my package.json and I run npm install.

+1

Still get it on angular.beta.15

+1

Please file a separate issue with a plunker demonstrating the problem.

+1

authors: 0xE282B0 Cajam MaikeMota NikGovorov SelcukTekin arsenys born2net cagataycivici candelibas danielgerlag frankwallis fxck ghaiat kanchansingh1123 mhevery mjd5 ourway supamax xx0r

license: mit

license_source: bigquery


text:
Any sample notebooks?

Bug description

Expected result

Actual result

Steps to reproduce

Context

Your Environment

Version used:
Operating System and version:
Link to your fork:

Created a notebook - https://github.com/aniketmaurya/fastserve/blob/main/examples/llama-cpp.ipynb

authors: andysingal aniketmaurya

repo: aniketmaurya/fastserve


text:
system cannot find file specified

Can you send debug log files?
Run the same command but this time add -ll DEBUG right after anime and before dl.

authors: ArjixWasTaken NoHaxJustBad

repo: anime-dl/anime-downloader

license: Unlicense


text:
syncthing

I wonder whether this solution for dropbox would also be adaptable for the Syncthing project. Thanks.

I don't know anything about Syncthing. In theory, if it supports primitives similar to Dropbox (including the "compare and swap" style operation), then it should be possible. This isn't something I'm interested in developing, but feel free to fork git-remote-dropbox if it works for your purposes.

authors: anishathalye dtxl

repo: anishathalye/git-remote-dropbox


text:
Is seashells down? Is it going to come back?

It is a very good service! I have used it a lot, but today it is saying :
502 Bad Gateway
nginx/1.10.3

Sorry, there was an issue with the hosting infrastructure. I got an alert on my phone when it went down, but I didn't have access to a computer until now to sort it out. It's back up now.
Just out of curiosity, how do you use seashells? If you're willing to share a bit of info on your use case, could you email me a short description at aathalye@me.com? I'm considering spending some time revamping the service, so I'm trying to better understand how people are using it.

Sorry, there was an issue with the hosting infrastructure. I got an alert on my phone when it went down, but I didn't have access to a computer until now to sort it out. It's back up now.
Just out of curiosity, how do you use seashells? If you're willing to share a bit of info on your use case, could you email me a short description at aathalye@me.com? I'm considering spending some time revamping the service, so I'm trying to better understand how people are using it.

I will send you a message, thanks very much!

I will send you a message, thanks very much!

authors: anishathalye esthon

repo: anishathalye/seashells


text:
predict_depth.m problem

Hello,
When I run the program, I encounter the following problems

Who encountered a similar problem, how to solve?
@ankush-me  Can predict_depth.m  be used directly?

It may be the problem of the wrong version of matconvnet.

@yingning  Hi, I used matconvnet-1.0-beta25. And I met the same problem. Which version of matconvnet should I choice?

It may be the problem of the wrong version of matconvnet.
I got the same problem on matlab 2018b. i used matconvnet1-0-beta25

authors: RogerCV lynx97 songwendong yingning

repo: ankush-me/SynthText


text:
yarn install报错：gifsicle pre-build test failed

有没有人遇到以下这个问题？
vben-2.6.1版本
在运行yarn install的时候一直报错，clean:lib，clean:cache都没用，删除-lock文件也没用，卡了好久了
`
warning " > vite-plugin-pwa@0.8.2" has unmet peer dependency "workbox-window@^6.1.5".
[5/6] Building fresh packages...
[8/13] ⠈ optipng-bin
[6/13] ⠈ jpegtran-bin
[9/13] ⠈ pngquant-bin
[7/13] ⠈ mozjpeg
error D:\workspace\xxx\xxx\node_modules\vite-plugin-imagemin\node_modules\gifsicle:
Command failed.
Exit code: 1
Command: node lib/install.js
Arguments:
Directory: D:\workspace\xxx\xxx\node_modules\vite-plugin-imagemin\node_modules\gifsi
cle
Output:
Response code 404 (Not Found)
gifsicle pre-build test failed
compiling from source
Error: Command failed: C:\WINDOWS\system32\cmd.exe /s /c "autoreconf -ivf"
'autoreconf' �����ڲ����ⲿ���Ҳ���ǿ����еĳ���
���������ļ���
at D:\workspace\xxx\xxx\node_modules\bin-build\node_modules\execa\index.js:231:1

1

我也是，
win11
node:v16.13.1
yarn:1.22.10
Output:
Response code 404 (Not Found)
gifsicle pre-build test failed
compiling from source
Error: Command failed: C:\WINDOWS\system32\cmd.exe /s /c "autoreconf -ivf"
'autoreconf' �����ڲ����ⲿ���Ҳ���ǿ����еĳ���
���������ļ���

我也是， win11 node:v16.13.1 yarn:1.22.10
Output:
Response code 404 (Not Found)
gifsicle pre-build test failed
compiling from source
Error: Command failed: C:\WINDOWS\system32\cmd.exe /s /c "autoreconf -ivf"
'autoreconf' �����ڲ����ⲿ���Ҳ���ǿ����еĳ���
���������ļ���

我找到原因了，还原这个文件就可以了yarn.lock。这个文件不能删除。

我换成pnpm，把官方的pnpm-lock.yaml放进项目里，好了

TL;DR: Change the resolutions section in package.json as below:
  "resolutions": {
    "bin-wrapper": "npm:bin-wrapper-china@0.1.0",
    "gifsicle": "5.2.0",
    "rollup": "^2.56.3"
  },

This fix also applies to anncwb/vben-admin-thin-next
The package bin-wrapper-china has the gifsicle-bin download issue by applying mirrors in binary-mirror-config, but the windows executable for v5.3.0 is missing in npmmirror.com (i.e. GET https://npmmirror.com/mirrors/gifsicle-bin/v5.3.0/vendor/win/x64/gifsicle.exe 404). Since both v5.2.0 and v6.1.0 exist and similar fixes (anncwb/vue-vben-admin#1497, anncwb/vue-vben-admin@2aabbc788ab05d06f4dcc2a01b25585ecf8f690b) uses v5.2.0, this fix chose that version as the resolution.
The @0.1.0 suffix is required in Yarn 2 protocal schemas (see https://yarnpkg.com/features/protocols). This fix is tested to successfully installed with Yarn v1.22.11 /v3.1.1 and Node v16.13.1 . Supposely this fix and those applied at anncwb/vue-vben-admin can fix anncwb/vue-vben-admin#345 and anncwb/vue-vben-admin#1438
Note for Yarn proxy settings:

For Yarn 1, use yarn config set proxy http://host:port and yarn config set https-proxy http://host:port in terminal, or you can edit ~/.yarnrc directly.
For Yarn 2 and up, use yarn config set httpProxy http://host:port and yarn config set httpsProxy http://host:port in terminal, or you can edit ~/.yarnrc.yml directly. Note that ~/.yarnrc will not work with Yarn 2.

authors: Rorschach331 Tanimodori xietongjian

repo: anncwb/vue-vben-admin


text:
Compatibility with Redmine 3.4.1

Hi,
I'm very interested in use this plugin in the company I am, but we are using Redmine 3.4.1 from bitnami.
Is there any restriction to use this version of the plugin in this version of Redmine?

Hi. I didn't try yet to run this plugin with Redmine 3.4.x.

Hi,
Thanks for the answer.
I tried here, but when I save the custom field with the computed formula, the fields of the formula disappear and the computation didn't work in the form.

Seconded - I have the same issue where all of the computed formula fields vanish as soon as the field is saved. Trying to edit a field you've set up as computed field (not immediately after creation) has the same problem with none of the  new fields being available.
Tested on Redmine 3.4.2, installed using the 3.4.2-passenger Dockerfile.

Same here, after saving the field, calulated fields are disappearing and there is no calculation happening anywhere. Its not possible to modify the field anymore.
Environment:
Redmine version                3.4.2.stable

I made a fix. All tests pass. You could get a new version of the plugin and try it.

Ok, thank you very much, I will give it a try.

Tested, this appears to be working now, although the computed fields are only computed on save and are not computed on any data that already exists in the database - @annikoff is this intentional?

Computation works only on save. If you need to recalculate all data you could create script #22.

Testet, core plugin works like a charm thanks you are a genius

I tested here and it is perfect!!
Thank you very much!!

authors: annikoff leith shikataleonardo x-itec


text:
How should we do with the .env?

I have looked in to the best practices for the .env and as mentioned before we should change the name of this file to prevent accidents in the future. The most common way is just remove this file and create a .env.example and fill it with template data (In our case the same content as we have in the .env today). I don't like this method as I think it makes it harder for new users to deploy the project. My first thought of adding a "template" .env file and then add it to the ignore file will not work according to this:
(Adding a file Git is already tracking to .gitignore has no effect.
A gitignore file specifies intentionally untracked files that Git should ignore. Files already tracked by Git are not affected)
I would prefer something like this, the problem is that some users may go against this not knowing that secrets should be kept in the .env.local and still add the variables to the .env and we have the same problem as if we commit the .env
In the end I think the best way would be to commit an .env.example as the best practice suggests to help developers list the variables used.
Then we have two options create an install script which runs npm install, creates an .env through an interactive prompt and launches the project. This will make it very convenient for new users to setup and run the project.
Or
Create a doc page with install instructions. Currently it isn't very hard to setup the project so this may be enough for now. Something like:
Clone the project
Run the database script
Run the server script
Rename the .env.template to .env
Adjust the values in the .env
Run npm install
Run npm run dev

@annk15
Sure I'll look into it!

@annk15
Sure I'll look into it!
Wink Eeehh GIFfrom Wink GIFs


text:
🛑 Pedtalant is down

In 93f0bd2, Pedtalant (https://педталант.рф) was down:

HTTP code: 0
Response time: 0 ms

Resolved: Pedtalant is back up in 67b85e8 after 32 minutes.

repo: ano-pedproject/repo


text:
🛑 Pedproject is down

In ceb974e, Pedproject (https://педпроект.рф) was down:

HTTP code: 0
Response time: 0 ms

Resolved: Pedproject is back up in 1bde1a5 after 12 minutes.


text:
🛑 Pedproject is down

In 1d48686, Pedproject (https://педпроект.рф) was down:

HTTP code: 0
Response time: 0 ms

Resolved: Pedproject is back up in fd5e043 after 15 minutes.