I have been working on a project that initially used the deprecated typings method for incorporating Typescript definitions. I now want to transition to using the @types method instead.
Currently, we have a typings.json file located in the root of the project with the following content:
{
"globalDependencies": {
"angular": "registry:dt/angular#1.5.0+20161101124950",
"angular-cookies": "registry:dt/angular-cookies#1.4.0+20160317120654",
"angular-material": "registry:dt/angular-material#1.1.0-rc5.0+20161208205836",
"angular-resource": "registry:dt/angular-resource#1.5.0+20160914132003",
"angular-translate": "registry:dt/angular-translate#2.4.0+20160729132354",
"d3": "registry:dt/d3#0.0.0+20160907005744",
"jquery": "registry:dt/jquery#1.10.0+20160929162922",
"lodash": "registry:dt/lodash#4.14.0+20161110215204",
"moment": "registry:dt/moment#2.11.1+20161010105546",
"require": "registry:dt/require#2.1.20+20160919185614"
},
"resolution": "src/client/typings",
"dependencies": {
"angular-local-storage": "registry:dt/angular-local-storage#0.1.5+20160726182927",
"angular-ui-router": "registry:dt/angular-ui-router#1.1.5+20161222093745",
"requirejs": "registry:npm/requirejs#2.2.0+20160319062357"
}
}
These dependencies are currently installed as globals and are located in a src/client/typings folder within our directory structure.
I have noticed that there is an @types folder under my node_modules which includes some of the typings mentioned in the typings.json file.
Within our tsconfig.json file, we have an 'include' configuration section:
"include": [
"./typings/index.d.ts",
"./app/**/*.module.ts",
"./app/**/*.run.ts",
"./app/**/*.routes.ts",
"./app/**/*.enum.ts",
"./app/**/*.controller.ts",
"./app/**/*.model.ts",
"./app/**/*.directive.ts",
"./app/**/*.filter.ts",
"./app/**/*.service.ts",
"./app/interfaces/**/*.ts"
],
To ensure that older typings not present in the @types folders are not being pulled in, I have commented out the ./typings/index.d.ts.
However, upon examining a .ts file containing AngularJS code, I have observed that the angular object is no longer resolving:
https://i.sstatic.net/e4Bjv.png
After researching, it seems I can resolve this issue by adding an import statement to the file (e.g.
import * as angular from 'angular'Is there a recommended way to make the angular reference global in my project, or should I continue with the practice of adding individual imports where necessary?
Thank you