Angular 1.x with TypeScript 2.x, @types, and SystemJS - Using global typings Angular 1.x with TypeScript 2.x, @types, and SystemJS - Using global typings angularjs angularjs

Angular 1.x with TypeScript 2.x, @types, and SystemJS - Using global typings


I can think of 2 approaches here.

1) Mark angular as global. (Much easier migration option)

Create a d.ts file say overrides.d.ts and do:

declare global {  const angular: ng.IAngularStatic;}export {};

or

import * as _angular_ from 'angular';declare global {  const angular: typeof _angular_;}

and that's it, no need to import or manage script loading separately for this.

2) Import it in every impacted file. (May be more tedious migration option on a large existing project)

If you can go ahead update all the impacted files (Usually a bit hard to take this approach in a much big project which already has lots of error related to this) where ever you refer to angular, import it:

import * as angular from "angular";

If you are taking this approach, typescript will transpile with angular as a dependency for the file and your module loader (eg: SystemJS) needs to handle the import. This may be done either by having systemJS manage the imports via maps/paths or if the script is loaded by script tags then you can create a fake module for angular by using SystemJS.registerDynamic or SystemJS.set apis.


Add this import to your code

import * as angular from "angularjs";

See Typescript Angular Import for more information


I was building a file watcher for the Webstorm IDE and ran into this problem. To solve it, I had to remove @types/angular, add typings angular also include typings angular in my compilation by adding the option: --types {your file dir}/typings/index.d.ts. Similarly, you can add that to your tsconfig.json

I know this is not the solution you were hoping for, but it got me over that hump.