Search code examples
angular2-webpack-starterangular

sample webpack angular4 application throwing errors


I am trying to create a sample angular-webpack application instucted in https://angular.io/docs/ts/latest/guide/webpack.html but it is throwing me about 26 errors. Even after changing typescript version to "~2.2.1", these errors are coming.

can anyone help me to fix these errors please?

[at-loader] Checking finished with 26 errors                                                                        chunk    {0} vendor.js
(vendor) 2.64 MB {2} [initial] [rendered]
chunk    {1} app.js, app.css (app) 3.57 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.

ERROR in [at-loader] ./node_modules/@angular/core/src/animation/animation_metadata_wrapped.d.ts:12:33
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/core/src/animation/dsl.d.ts:34:33
    TS1039: Initializers are not allowed in ambient contexts.

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

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

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

ERROR in [at-loader] ./node_modules/@angular/core/src/errors.d.ts:12:43
    TS1039: Initializers are not allowed in ambient contexts.
ERROR in [at-loader] ./node_modules/@angular/core/src/errors.d.ts:13:35
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/core/testing/src/before_each.d.ts:1:59
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/http/src/backends/browser_jsonp.d.ts:1:33
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/platform-browser/src/dom/dom_renderer.d.ts:14:41
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./node_modules/@angular/router/src/shared.d.ts:15:37
    TS1039: Initializers are not allowed in ambient contexts.

ERROR in [at-loader] ./src/app/app.component.spec.ts:3:1
    TS2304: Cannot find name 'describe'.

ERROR in [at-loader] ./src/app/app.component.spec.ts:4:3
    TS2304: Cannot find name 'beforeEach'.

ERROR in [at-loader] ./src/app/app.component.spec.ts:7:3
    TS2304: Cannot find name 'it'.

ERROR in [at-loader] ./src/app/app.component.spec.ts:9:5
    TS2304: Cannot find name 'expect'.

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'.
Child html-webpack-plugin for "index.html":
    chunk    {0} index.html 325 bytes [entry] [rendered]
Child extract-text-webpack-plugin:
    chunk    {0} extract-text-webpack-plugin-output-filename 1.92 kB [entry] [rendered]
webpack: Failed to compile.

Solution

  • The TSXXX errors seems definitely related to using a TypeScript prior to version 2.1 as explained for example here and here.

    Please verify:

    • the TypeScript version declared in you package.json file ("typescript": "~2.2.1" will be OK)
    • the TypeScript version that you are effectively using to compile the project. You can verify that from the output of the npm start command. You should see something like this [at-loader] Using [email protected] from typescript and "tsconfig.json" from /usr/src/ng2-projects/angular-webpack/src/tsconfig.json; the typescript@ part will show the version used for compilation.

    The TS2304 errors seems linked to a misconfiguration of the required type declarations. See here for a clear explanation of how configure them.