wpcfan / awesome-tutorials Goto Github PK

之所以提这个是因为我在本地无法运行项目，应该是版本的问题。
你在 readMe.md 文件里的 "环境配置要求" 部分写了 安装ng的命令，但最好补充下安装的ng的版本，比如在文章补充一下 "npm install -g @angular/cli@latest 命令执行后，安装的版本是 2.4.10"，或者命令里指定ng版本

依赖包安装后，执行ng serve 后报错，找不到 @angular/animations 模块

我猜应该是因为 animations 从Angular 最新版本的core模块中移除了，代码需要根据具体的Angular 版本改动吧，比如import导入模块语句。

完整的信息，包括ng版本信息，主要是报错信息：
执行 ng -v
@angular/cli: 1.0.1
node: 6.9.4
os: win32 x64
@angular/common: 2.4.10
@angular/compiler: 2.4.10
@angular/core: 2.4.10
@angular/flex-layout: 2.0.0-beta.8
@angular/forms: 2.4.10
@angular/http: 2.4.10
@angular/material: 2.0.0-beta.3
@angular/platform-browser: 2.4.10
@angular/platform-browser-dynamic: 2.4.10
@angular/router: 3.4.10
@angular/cli: 1.0.1
@angular/compiler-cli: 2.4.10

执行 ng serve
** NG Live Development Server is running on http://localhost:4200 **
Hash: dfda5f6efe13451ae887
Time: 33757ms
chunk {0} main.bundle.js, main.bundle.js.map (main) 68.4 kB {2} [initial] [rendered]
chunk {1} styles.bundle.js, styles.bundle.js.map (styles) 67 kB {3} [initial] [rendered]
chunk {2} vendor.bundle.js, vendor.bundle.js.map (vendor) 4.89 MB [initial] [rendered]
chunk {3} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry] [rendered]

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/media-query/breakpoints/break-points-token.js
13:29-43 "export 'InjectionToken' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/flex.js
299:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/layout.js
177:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/show-hide.js
296:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/flex-align.js
177:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/flex-fill.js
53:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/flex-offset.js
163:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/flex-order.js
161:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/layout-align.js
256:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/layout-wrap.js
204:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/layout-gap.js
243:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/class.js
287:12-21 "export 'Renderer2' was not found in '@angular/core'

WARNING in ./~/.2.0.0-beta.8@@angular/flex-layout/flexbox/api/style.js
333:12-21 "export 'Renderer2' was not found in '@angular/core'

ERROR in F:/test/ng2-tut/node_modules/@angular/material/typings/dialog/dialog-container.d.ts (2,32): Cannot find module '@angular/animations'.

ERROR in F:/test/ng2-tut/node_modules/@angular/material/typings/menu/menu-animations.d.ts (1,42): Cannot find module '@angular/animations'.

ERROR in F:/test/ng2-tut/node_modules/@angular/material/typings/select/select-animations.d.ts (1,42): Cannot find module '@angular/animations'.

ERROR in F:/test/ng2-tut/node_modules/@angular/material/typings/snack-bar/snack-bar-container.d.ts (2,32): Cannot find module '@angular/animations'.

ERROR in F:/test/ng2-tut/node_modules/@angular/material/typings/tabs/tab-body.d.ts (2,32): Cannot find module '@angular/animations'.

ERROR in F:/test/ng2-tut/node_modules/@angular/material/typings/tooltip/tooltip.d.ts (2,32): Cannot find module '@angular/animations'.

ERROR in F:/test/ng2-tut/node_modules/@angular/flex-layout/flexbox/api/base.d.ts (8,22): Module '"F:/test/ng2-tut/node_modules/@angular/core/index"' has no exported member 'Renderer2'.

ERROR in F:/test/ng2-tut/node_modules/@angular/flex-layout/flexbox/api/base-adapter.d.ts (8,22): Module '"F:/test/ng2-tut/node_modules/@angular/core/index"' has no exported member 'Renderer2'.

ERROR in F:/test/ng2-tut/node_modules/@angular/flex-layout/media-query/breakpoints/break-points-provider.d.ts (8,10): Module '"F:/test/ng2-tut/node_modules/@angular/core/index"' has no exported member 'InjectionToken'.

ERROR in F:/test/ng2-tut/node_modules/@angular/flex-layout/media-query/breakpoints/break-points-token.d.ts (8,10): Module '"F:/test/ng2-tut/node_modules/@angular/core/index"' has no exported member 'InjectionToken'.

ERROR in Error encountered resolving symbol values statically. Calling function 'InjectionToken', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol BREAKPOINTS in F:/test/ng2-tut/node_modules/@angular/flex-layout/media-query/breakpoints/break-points-token.d.ts, resolving symbol DEFAULT_BREAKPOINTS_PROVIDER in F:/test/ng2-tut/node_modules/@angular/flex-layout/media-query/breakpoints/break-points-provider.d.ts, resolving symbol FlexLayoutModule in F:/test/ng2-tut/node_modules/@angular/flex-layout/flexbox/_module.d.ts, resolving symbol FlexLayoutModule in F:/test/ng2-tut/node_modules/@angular/flex-layout/flexbox/_module.d.ts

ERROR in .//.2.0.0-beta.3@@angular/material/@angular/material.es5.js
Module not found: Error: Can't resolve '@angular/animations' in 'F:\test\ng2-tut\node_modules.2.0.0-beta.3@@angular\material@angular'
@ .//.2.0.0-beta.3@@angular/material/@angular/material.es5.js 20:0-81
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

ERROR in .//.0.27.3@css-loader?{"sourceMap":false,"importLoaders":1}!.//.1.3.3@postcss-loader?{"ident":"postcss"}!.//.6.0.3@sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/styles.scss
Module build failed:
@import '@angular/material/core/theming/all-theme';
^
File to import not found or unreadable: ~@angular/material/core/theming/all-theme.
Parent style sheet: stdin
in F:\test\ng2-tut\src\styles.scss (line 1, column 1)
@ ./src/styles.scss 4:14-211
@ multi ./src/styles.css ./src/styles.scss
webpack: Failed to compile.

https://github.com/wpcfan/hi-angular
报错404

代码中有：
import 'rxjs/add/operator/toPromise';

但是在代码库中找不到这一行。

教程写的很好，多谢了！

能否留下QQ 或者 QQ邮箱 或者 创建一个QQ群，读者都能加进来一起讨论同一份代码
gmail要翻墙才能访问 mailto:[email protected]

112页倒数第三段最后一行笔误

是不是我的模块改拆分了？

应该为

是不是我的模块该拆分了？

另外有一个问题想请教一下：

如果我使用了 路由 配合 <router-outlet> 是不是 就没法往 里传递 @input 属性了? 比如像这样：

<router-outlet  [var1]="var_a" [var2]="var_b"></router-outlet>

哪怕我能够保证所有插入outlet 的组件 都有 var1 和 var2 的 Input 属性变量。

在第二章，建立一个服务去完成业务逻辑 的小节中
ng g s core\auth 应该为
ng g s core/auth

README.md 文件里的 https://github.com/wpcfan/awesome-tutorials/tree/chap02/angular2/ng2-tut
项目里根本就没有 tree 这个文件夹
麻烦顺便检查下其他章节的代码的链接是否也失效了

63页倒数第二段，开头第一句话：

“父组件中声明为@input......" 应为 ”子组件中声明为@input.....".

Angular CLI: 8.2.2
Node: 10.16.2
OS: linux x64
Angular: 8.2.2

下，原来代码编译有问题。 我 修改代码，主要关注功能，供参考

https://github.com/ping40/book-angular-from-zero-to-one

目前看到了书本 72页。

@wpcfan 你好，
我之前都是用jit的那种模式配置，然后我参考你关于aot的说明，在main.ts中改用：

但提示 cannot find module app.module.ngfactory ，请问这个app.module.ngfactory是哪来的呢？还需要怎么配置？
谢谢！

我按照书上的代码敲进去，但是运行的时候报错，求指导。

Error ​ columnNumber: 31 ​ fileName: "http://localhost:4200/polyfills.bundle.js line 597 > eval" ​ lineNumber: 809 ​ message: "Uncaught (in promise): Object: {\"body\":{\"error\":\"Object(...) is not a function\"},\"url\":\"api/todos\",\"headers\":{\"Content-Type\":[\"application/json\"]},\"status\":500,\"statusText\":\"Internal Server Error\"}" ​ promise: Object { __zone_symbol__state: 0, __zone_symbol__value: {…} } ​ rejection: Object { url: "api/todos", status: 500, statusText: "Internal Server Error", … } ​ stack: "resolvePromise@webpack-internal:///./node_modules/zone.js/dist/zone.js:809:31\nresolvePromise@webpack-internal:///./node_modules/zone.js/dist/zone.js:775:17\nscheduleResolveOrReject/<@webpack-internal:///./node_modules/zone.js/dist/zone.js:858:17\nZoneDelegate.prototype.invokeTask@webpack-internal:///./node_modules/zone.js/dist/zone.js:421:17\nonInvokeTask@webpack-internal:///./node_modules/@angular/core/esm5/core.js:4956:24\nZoneDelegate.prototype.invokeTask@webpack-internal:///./node_modules/zone.js/dist/zone.js:420:17\nZone.prototype.runTask@webpack-internal:///./node_modules/zone.js/dist/zone.js:188:28\ndrainMicroTaskQueue@webpack-internal:///./node_modules/zone.js/dist/zone.js:595:25\nZoneTask.invokeTask@webpack-internal:///./node_modules/zone.js/dist/zone.js:500:21\nZoneTask/this.invoke@webpack-internal:///./node_modules/zone.js/dist/zone.js:485:28\ntimer@webpack-internal:///./node_modules/zone.js/dist/zone.js:2025:17\n" ​ task: Object { runCount: 0, _state: "notScheduled", type: "microTask", … } ​ zone: Object { _properties: {…}, _parent: {…}, _name: "angular", … } ​ __proto__: Object { … }

文章中使用 angular2-mdl 产生对话框，可是现在 安装了 angular2-mdl 更本找不到 MdlDialog 这个名字。请问该如何使用？ 谢谢。

ERROR in E:/GithubClone/Angular-Demo/angular01/node_modules/angular-in-memory-web-api/http-client-backend.service.d.ts (1,97): Cannot find module '"@"angular/common/http'.

ERROR in E:/GithubClone/Angular-Demo/angular01/node_modules/angular-in-memory-web-api/http-client-in-memory-web-api.module.d.ts (2,41): Cannot find module '"@"angular/common/http'.

Cannot find module 'angular/common/http'.

import { AppModule } from './app/';
has an error:
Cannot find module './app/'

图片里面 angular 2 的组件生命周期函数 组件销毁应是 ngOnDestroy。

正在学习此文，谢谢您的教程。

constructor(private store$: Store<Todo[]>){
...
this.todos = this.store$.select('todos');
}

查看源码发现上面的Store<Todo[]>应该是Store