标签: angular-cli

我正在使用Angular CLI(1.1.2)构建一个Angular4项目.它在Chrome(版本59.0.3071.115)和firefox(54.0.1)中运行完美,但是当我尝试使用IE11(Verison 11.0.9600.18738)时,nothings出现并且当我在IE中打开开发模式时,它显示以下错误:

SCRIPT5022: Exception thrown and not caught
File: polyfills.bundle.js, Line: 829, Column: 34

详细的错误消息如下:

谁知道如何解决这个问题？

谢谢!

使用Angular cli为我的应用程序提供服务时,如何禁用自动重新加载？

ng --help提到了--live-reload选项,但我不能让它工作.

ng serve --live-reload=false或者ng serve --live-reload false不工作

编辑:它似乎是一个错误https://github.com/angular/angular-cli/issues/1755

在角度2我使用

ng g c componentname

但它在Angular 4中不受支持,因此我手动创建它,但它显示错误,它不是模块.

我最近一直在使用Angular-CLI.它带有许多命令,包括ng serve旋转服务器localhost:4200.

我习惯使用Grunt和Gulp,它可以根据我的需要进行配置.我想配置Angular-CLI的服务器但后来我意识到我不知道它是什么或如何配置它.对项目进行掠夺serve并没有挖掘出任何看似有用的东西.

那究竟是ng serve做什么的？

我刚刚使用新的Angular CLI 6.0创建了一个新的Angular项目,但我需要将Sass编译添加到我的项目中.我知道你可以在创建项目时设置一个标志,但我的项目已经创建并且已经完成了工作.

现在调用使用新Angular CLI生成的新配置文件angular.json而不是angular-cli.json.该文件的方案也有所不同,具有新属性.

在旧的angular-cli.json有一个部分,你可以这样设置stylExt,

"defaults": {
    "styleExt": "scss"
}

但是我不知道究竟要把它放在哪里,因为在"test"和"lint"属性之后,给出了一个lint错误:

Matches multiple schemas when only one must validate.

和建筑产品:

Schema validation failed with the following errors: Data path "['defaults']" should NOT have additional properties(styleExt).

看看CLI的文档,我没有看到任何可以指示放置位置的内容"styleExt".

我已经看到其他答案建议:ng set defaults.styleExt scss哪个抛出get/set have been deprecated in favor of the config command..

我试过ng config set defaults.styleExt scss并且npm config set …

只是想了解如何Angular在幕后构建和运行？

以下是我迄今所理解的内容.想知道我是否错过了什么.

Angular的构建方式

在使用我们的角度应用程序编码后TypeScript,我们使用Angular CLICommand来构建应用程序.

ng buildcommand将应用程序编译到输出目录中,构建工件将存储在dist/目录中.

内部流程

1. Angular CLI运行Webpack以构建和捆绑所有JavaScript和CSS代码.

2. 依次Webpack调用TypeScriptLoaders,它们获取.ts角项目中的所有文件,然后将它们转换JavaScript为.js文件,浏览器可以理解.

这篇文章说Angular有两个编译器:

• 查看编译器

• 模块编译器

有关构建的问题

调用构建过程的顺序是什么？

Angular CLI First调用在Typescript =>中编写的angular内置编译器,然后调用Typescript Transpiler =>然后调用Webpack进行捆绑并存储在dist/目录中.

Angular如何运行

构建完成后,我们所有应用程序的组件,服务,模块等都会转换为Javascript .js文件,用于在浏览器中运行角度应用程序.

Angular Docs中的陈述

1. 当您使用AppComponent类引导(在main.ts中)时,Angular <app-root>在其中index.html查找a ,找到它,实例化AppComponent的实例,并将其呈现在<app-root>标记内.

2. 当用户在应用程序中移动时,Angular会创建,更新和销毁组件.

关于运行的问题

尽管main.ts在上面的Statement中用于解释引导过程,但是不是角度应用程序是自引导还是使用Javascript .js文件启动？

是不是所有上述语句都是使用 …

我正在尝试将我的角度2项目从2.0.0升级到2.4.1.据我所知,自2.0.0版本开始采用语义版本控制,2.xx版本应该是替代版本.我的经验似乎表明不是这样.也许我只是不知道我在做什么,但我没有发现这是直截了当的......

尝试1 - 手动版本升级

我天真的第一种方法是手动更新我的@angular依赖项.您可以在下面引用我的package.json(更新1).我做了这些更改,然后做了一个2.0.0,我收到了几个警告,然后当我尝试做一个时出现以下错误2.4.1.

无法读取未定义的属性'AssetUrl'

我的警告......

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.0.15: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN @angular/core@2.4.1 requires a peer of rxjs@^5.0.1 but none was installed.
npm WARN @angular/core@2.4.1 requires a peer of zone.js@^0.7.2 but none was installed.
npm WARN @angular/http@2.4.1 requires a peer of rxjs@^5.0.1 but none was installed.
npm WARN @angular/compiler-cli@0.6.4 requires a peer of @angular/compiler@2.0.2 but none was …

我正面临一个异常ng build（为差异加载生成 ES5 包......）

An unhandled exception occured: Call retires were exceeded

使用过的版本：

• 角CLI： 8.3.20
• 角度： 8.2.7
• 节点： 12.12.1

同样在日志中，它被提到

[error] Error: Call retries were exceeded at ChildProcessWorker.initialize

(即使使用Angular 7也确认了问题).让我们解决这个问题!

我正在使用HMR设置:https://github.com/angular/angular-cli/wiki/stories-configure-hmr from a ng newbuild build.

如果我更改任何组件并使其延迟加载,角度HMR将热重新加载所有内容,使页面同步更慢.

我知道这是因为它默认设置为console.log每个正在重新加载的模块,当我使用惰性路由时,它会记录所有内容.但是当我将该组件更改为非延迟加载时,它只记录一些小组件.

因此,当我使用HMR和懒惰路由时,我的应用程序需要几秒钟才能刷新.这很烦人.

有没有办法解决？

(懒惰的加载路线是通过这样的方式完成的)

// Main homepage
{
  path: '',
  loadChildren: './public/home/home.module#HomeModule'
},
// ...

(只是一个例子,表明我正在以正确的方式加载)

这里有一些日志记录显示我懒惰加载时会发生什么 home.component.ts

// Everything here is normal, great!
[HMR]  - ../../../../../src/app/public/home/home.component.html
log.js:23 [HMR]  - ../../../../../src/app/public/home/home.component.ts
log.js:23 [HMR]  - ../../../../../src/app/public/home/home.module.ts
log.js:23 [HMR]  - ../../../../../src/app/public/home/home.routing.ts
// Everything below here is NOT normal, bad!  All this is extra.  These are my modules, yes, but all this needs to be loaded again?
log.js:23 …

在最新版本的Angular 6中,使用providedIn服务元数据中的属性在模块中注册服务:

@Injectable({
  providedIn: 'root',
})
export class HeroService {}

但是文档仍然指的是providers在模块元数据中注册模块数组中的服务,就像我们在Angular 5中一样:

@NgModule({
  providers: [HeroService],
})
export class AppModule {}

那么应该使用哪种方法使注入器知道它应该注入的服务&模块提供者的数组方法是否会被弃用？