Angular-cli: typings.d.ts is not working as described in readme

[MickL]

I tried to add a global typings.d.ts exactly as described in readme but TypeScript compiler says Cannot find module 'typeless-package'.

Maybe the description is outdated?

Do I have to add it manually to tsconfig.json? If so i get the same error:

"typeRoots": [ "../node_modules/@types", "./typings.d.ts" ]

[filipesilva]

Well, you shouldn't actually add in typeless-package but rather your package name. What package are you trying to make work?

[MickL]

A third party library which doesnt have any typings. I tried the example just to make it work first. Could you give a working example please? Is the typings.d.ts automatically added? If so, the import as from is not working as stated in the readme.

[filipesilva]

I can give you a working example if you tell me the package name... but if you can't do that, then just replace typeless-package by the package name.

[MickL]

Im not sure if module is up to date in typescript? Didnt it got replaced by namespace?

I tried:

export declare namespace TypelessPackage {
  export function test():boolean;
}

Then:

import {TypelessPackage} from "../../typings";
TypelessPackage.test();

But it says Module not found: Error: Can't resolve '../../typings' in '/<<path>>/src/app/shared'

[MickL]

A more simple example which doesnt work would be:

src/typings.d.ts

export declare let foo: number;

some.component.ts

import {foo} from "../typings";
console.log(foo);

[filipesilva]

Let's assume your package is called mickl-package. You're installing via npm install mickl-package or maybe even locally via npm install ../../../mickl-package.

Following the instructions then gets you the following:

// typings.d.ts
declare module 'mickl-package';

The package has an exported function called test. You can use it by doing the following:

// main.ts
// I'm calling it micklPackage but it can be whatever name you want
import * as micklPackage from 'mickl-package';
micklPackage .test();

This should be all you need. If you're trying to do something more complicated and trying to use other declaration features, then you'll need to check out https://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html instead.

These instructions on our README are meant as a guide to get installed packages working, not as a guide for writing declaration files in general.

[MickL]

Oh i guess your last mention is the problem. I have a single js-file which is not installed by npm. And i just wanted to write a declaration file for it so i can use its functions without ts-errors.

Not sure how to do it, but the part of the readme doesnt seem to be what i needed.

[filipesilva]

I think you can probably do with using one of these templates: https://www.typescriptlang.org/docs/handbook/declaration-files/templates.html

Which one depends on the kind of library your file represents: https://www.typescriptlang.org/docs/handbook/declaration-files/library-structures.html

[osadan]

@MickL I added

"typeRoots": [ "../node_modules/@types", "./typings.d.ts" ]

to tsconfig.json

and in typings.d.ts I added

export = "module-name";
export as namespace "module-name";
declare var "module-name";

and it worked fine

[artuska]

@osadan

When I add typings.d.ts to the typeRoots config I get:

ERROR in E:/Dropbox/angular2-cli/src/typings.d.ts (14,2): Statements are not allowed in ambient contexts.

Oh, I found there is no need to add typings.d.ts to the typeRoots config — just write your declarations in typings.d.ts and it works.

declare var module: NodeModule;
declare var ymaps: ymaps;

interface NodeModule {
    id: string;
}

interface ymaps {
    geometry: any;
    shape: any;
    templateLayoutFactory: any;
    Balloon: any;
    Placemark: any;
}

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}