AngularJs + Typescript: error TS2307: Cannot find module 'angular'

Question

I'm trying to combine Angular1.5 + Typescript. Installed needed types:

npm install @types/angularjs

but still see the error:

error TS2307: Cannot find module 'angular'

Already tried different options:

import 'angular';
import 'angularjs'; //that is name inside @types
import angular from 'angularjs';
import * as angular from 'angular';

I'm using:

"ts-loader": "1.0.0",
"typescript": "2.0.7",
"webpack": "1.13.3",
"webpack-dev-server": "1.16.2"

tsconfig is pretty standard:

{
  "compilerOptions": {
    "target": "es5",
    "noImplicitAny": false,
    "sourceMap": false,
    "lib": ["es6", "dom"],
    "typeRoots": ["./node_modules/@types"]
  },
  "exclude": ["node_modules"]
}

already simplified webpack config as much as possible: var webpack = new require('webpack');

module.exports = {
  context: __dirname + '/src',
  entry: './index.ts',
  output: {
    path: './dist',
    filename: 'app.bundle.js'
  },
  module: {loaders: [{test: /\.tsx?$/, loader: 'ts-loader'},]},
  resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js'],
  },

  plugins: [new webpack.NoErrorsPlugin()],

  devtool: 'source-map',

  devServer: {
    contentBase: './dist',
    historyApiFallback: true,
    inline: true
  }
};

And I also simplified index.ts itself, to focus only on type import:

import * as angular from 'angular';
angular.module('testmodule', []);

UPD: tsconfig.json. Added typeRoots option.

Now getting new errors:

ERROR in .../node_modules/@types/angularjs/angular-mocks.d.ts (6,26): error TS2307: Cannot find module 'angular'.

ERROR in .../node_modules/@types/angularjs/angular-mocks.d.ts (65,49): error TS2304: Cannot find name 'IServiceProvider'.

ERROR in .../node_modules/@types/angularjs/angular-mocks.d.ts (122,62): error TS2304: Cannot find name 'IScope'.

ERROR in .../node_modules/@types/angularjs/index.d.ts (66,43): error TS2304: Cannot find name 'JQuery'.

Answer 1

if you run this in the command line it should fix the issue.

npm install @types/angular

What's annoying about this fix is that for some reason it doesn't update your package.json.. However if you add the following to your dependencies within package.json instead of the above it should fix the issue and have the package.json mirror your packages.

"@types/angular": "1.6.5",
"@types/jquery": "2.0.40",