webpack introduction problem

[rixlabs]

Hi, I'm trying to follow the Configuring Webpack section and after creating all the files I tried npm start.

First my env: OS: mac osx 10.12.3 Node: v6.9.4 npm: 4.1.2

I can see the page on http://localhost:8080 but I have this errors in console:

at-loader] Checking finished with 16 errors
chunk    {0} vendor.js (vendor) 2.64 MB {2} [initial] [rendered]
chunk    {1} app.js, app.css (app) 3.43 kB {0} [initial] [rendered]
chunk    {2} polyfills.js (polyfills) 577 kB [entry] [rendered]

WARNING in ./~/@angular/core/@angular/core.es5.js
5870:15-36 Critical dependency: the request of a dependency is an expression

WARNING in ./~/@angular/core/@angular/core.es5.js
5886:15-102 Critical dependency: the request of a dependency is an expression

ERROR in [at-loader] ./node_modules/@angular/common/src/platform_id.d.ts:8:42
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/common/src/platform_id.d.ts:9:41
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/common/src/platform_id.d.ts:10:45
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/common/src/platform_id.d.ts:11:44
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/compiler/src/util.d.ts:8:36
    TS1039: Initializers are not allowed in ambient contexts.
...

I found in angular-cli issues that it can be something with TypeScript version but I'm new and can't propose a decent solution myself.

[rixlabs]

actually updating TypeScript to :

"typescript": "~2.2.1"

Fix the problem still have the warning but no more errors.

It can be a viable solution. I need your knowledge 😄

[Foxandxss]

I am sorry my man. I need to update the docs to v4 and I was fighting with something else.

I can't do it now, but for the time being, go to this file. Look for:

/angular(\\|\/)core(\\|\/)(esm(\\|\/)src|src)(\\|\/)linker/,

and replace it with

/angular(\\|\/)core(\\|\/)@angular/,

[rixlabs]

Right now with typescript upgraded and the fi for the ContextReplacementPlugin it's working perfectly.

So the typescript upgrade is mandatory, tried the fix with the "~2.0.10" and the initialazer problem came back.

Thanks a lot, now I need some time to study the thing 😄

[stevexy]

I met the same problem and try the fixed above。 my env: OS: windows 7 Node: v6.10.3 npm: 3.10.10

and then I have this errors in console:

`ERROR in [at-loader] ./src/app/app.component.ts:5:13 TS2304: Cannot find name 'require'.

ERROR in [at-loader] ./src/app/app.component.ts:6:12 TS2304: Cannot find name 'require'.

ERROR in [at-loader] ./src/main.ts:4:5 TS2304: Cannot find name 'process'.

ERROR in [at-loader] ./src/polyfills.ts:3:1 TS2304: Cannot find name 'require'.

ERROR in [at-loader] ./src/polyfills.ts:5:5 TS2304: Cannot find name 'process'.

ERROR in [at-loader] ./src/polyfills.ts:10:3 TS2304: Cannot find name 'require'.`

[hallids]

@stevexy I had this problem (TS2304) and fixed it this way:

1. Move from tsconfig.json from src/ to the project root
2. Update webpack.common.js - find options: { configFileName: helpers.root('src', 'tsconfig.json') } and remove 'src'.
3. Add the below to tsconfig.json as a child of "compilerOptions":

    "typeRoots": [
      "node_modules/@types"
    ]

[stevexy]

yes,it works perfectly!Thanks a lot O(∩_∩)O哈哈~

[shidatonglin]

I fixed the errors you guys mentioned above, but met another errors ERROR in [at-loader] ./node_modules/[email protected]@rxjs/Subject.d.ts:16:22 TS2415: Class 'Subject<T>' incorrectly extends base class 'Observable<T>'. Types of property 'lift' are incompatible. Type '<R>(operator: Operator<T, R>) => Observable<T>' is not assignable to type '<R>(operator: Operator <T, R>) => Observable<R>'. Type 'Observable<T>' is not assignable to type 'Observable<R>'. Type 'T' is not assignable to type 'R'.

ERROR in [at-loader] ./node_modules/[email protected]@rxjs/observable/dom/WebSocketSubject.d.ts:23:22 TS2415: Class 'WebSocketSubject<T>' incorrectly extends base class 'AnonymousSubject<T>'. Types of property 'lift' are incompatible. Type '<R>(operator: Operator<T, R>) => WebSocketSubject<R>' is not assignable to type '<R>(operator: Op erator<T, R>) => Observable<T>'. Type 'WebSocketSubject<R>' is not assignable to type 'Observable<T>'. Types of property 'operator' are incompatible. Type 'Operator<any, R>' is not assignable to type 'Operator<any, T>'. Type 'R' is not assignable to type 'T'.

anyone have idea?

[shidatonglin]

I have fixed it by following https://stackoverflow.com/questions/44810195/how-do-i-get-around-this-subject-incorrectly-extends-observable-error-in-types