Angular 2 with errors in Sublime Text 3

Question

I try to start a new project in Angular 2 on Windows based on the following repository: https://github.com/mgechev/angular2-seed

Everything works fine (npm install, npm start, ...) except that Sublime Text 3 shows me some errors that are not present when I execute the project.

Here are the steps I followed:

$ git clone https://github.com/mgechev/angular2-seed.git
$ cd angular2-seed
$ npm install

Then I open the project with Sublime Text (with the TypeScript package) and I face some errors/warnings in the code.

Error #1

Classes with @Component decorators show the following error:

Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.

(it ignores the line "experimentalDecorators": true in tsconfig.json)

Error #2

In src/client/app/about/about.component.ts for example, on the line:

  moduleId: module.id,

Sublime shows this error:

Cannot find name 'module'.

The tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "declaration": false,
    "removeComments": true,
    "noLib": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es6", "es2015", "dom"],
    "sourceMap": true,
    "pretty": true,
    "allowUnreachableCode": false,
    "allowUnusedLabels": false,
    "noImplicitAny": true,
    "noImplicitReturns": true,
    "noImplicitUseStrict": false,
    "noFallthroughCasesInSwitch": true,
    "typeRoots": [
      "./node_modules/@types",
      "./node_modules"
    ],
    "types": [
      "node"
    ]
  },
  "exclude": [
    "node_modules",
    "dist",
    "src"
  ],
  "compileOnSave": false
}

The package.json

https://github.com/mgechev/angular2-seed/blob/27db8a19f70470f5110482df1a4debc1100ec347/package.json

Do you why I have this 2 errors? I can develop but it's not very pleasant.

Answer 1

I solved my issue thanks to this link: https://github.com/Microsoft/TypeScript-Sublime-Plugin/issues/470

To summarize:

• Go to the User preferences (Ctrl + Shift + P > Preferences: Settings)
• Add the following line: "typescript_tsdk": "C:/...../npm/node_modules/typescript/lib", (with the appropriate link)
• Restart Sublime Text
• Test if it works in about.component.ts file by pressing F12 when the cursor is on module.id
• Enjoy!

Answer 2

I'll add my finding with the exact same problem.

I've got this problem and fixed it using the method listed above. But after I've brought my frontend app to the server-side file structure (I use flask as my server-side engine), the problem reappears. I've solved it using changing tsc path from system-wide into /frontend/node_modules/typescript/bin/tsc - namely, the local version of the typescript I'd used inside my project. That solved my problem – by now.