Typescript can't find a module that has been mapped with SystemJS

Question

Typescript doesn't find the module in this import import ga from 'googleAnalytics';

SystemJS knows where to find the module, because it has been mapped up front like so:

map: {
    '@angular': 'node_modules/@angular',
    'rxjs': 'node_modules/rxjs',
    'underscore': 'node_modules/underscore/underscore-min.js',
    'googleAnalytics': '//www.google-analytics.com/analytics.js'
},

How can I provide similar mapping to the tsc?

This other question seems to point in a good direction: How to avoid imports with very long relative paths in Angular 2?

Typescript 2.0 seems to support the paths config for the tsconfig.json. Is there a way to download Typescript 2.0? Can I give the path config an http url (//www.google-analytics.com/analytics.js) like I'm doing with SystemJS? If there is no way to download Typescript 2.0, how can I achieve what I want with the current version?

Edit

The specific error I get is: "Cannot find module 'ga'".

Here is my tsconfig.json:

{
    "compilerOptions": {
        "rootDir": "./",
        "target": "es5",
        "module": "system",
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "noImplicitAny": true
    },
    "exclude": [
        "node_modules",
        "front-end/node_modules",
        "typings/main",
        "typings/main.d.ts"
    ]
}

I don't think Typescript 2 has been released yet. https://github.com/Microsoft/TypeScript/tags — , May 09 '16 at 23:59
what happens if you import it like this `import {ga} from 'googleAnalytics';` — iberbeu, May 12 '16 at 07:14
Same error. Whether I do `import ga`, `import {ga}` or `import *` doesn't matter, because it doesn't find the module `googleAnalytics`. The reason I get the error `Cannot find module 'ga'` is because @jasonszhao told me to rename `googleAnalytics` to `ga` (see the only answer below). I admit this is confusing! — Maxime Dupré, May 12 '16 at 19:09

score 1 · Answer 1 · 2016-05-10T05:01:50.313

1

This problem can be worked around with Typescript Type Definitions.

To use the definition:

Put the type definition in your directory. Premade ones are provided by DefinitelyTyped.
Add this line to the .ts file that needs to import Google Analytics:
```
/// <reference path="ga.d.ts" />
```

Update

It did work for me when I ran tsc. Sorry I forgot to add:

Refactor to ga in your imports and SystemJS mapping.

This does not make the compiler know that it needs to check the SystemJS file, but just acts like a placeholder for the module that you import, so that no error is thrown and we can actually resolve the module during runtime with SystemJS.

edited May 10 '16 at 05:01

answered May 10 '16 at 01:26

I didn't think this would work, but I still tried it (and it didn't work). How is this `d.ts` file suppose to tell the `tsc` that to find the `googleAnalytics` module, it needs to look at the SystemJs mapping (or at least have the same mapping)? Maybe it doesn't need to know the mapping, but only find a corresponding `d.ts` file, but how would the `tsc` compiler link a custom module name such as `googleAnalytics` to `ga.d.ts`? – Maxime Dupré May 10 '16 at 04:16
It's still not working, maybe because the `d.ts` doesn't declare a module? https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/google.analytics/ga.d.ts – Maxime Dupré May 10 '16 at 06:09
I edited my question with the additional information. – Maxime Dupré May 10 '16 at 22:04

Stanislav Šolc · Accepted Answer · 2016-05-15T21:14:57.690

0

i guess you understand that in case of typescript compilation transpiler is looking for definitly type files. He needs to know type definition of external module. I case you have active nodejs module resolution (you have) and you use a non-relative path (you do) you have to add to your project node_modules directory (maybe you already have one) and to this directory add googleAnalytics.d.ts file or you can create node_modules/googleAnalytics directory and then add there index.d.ts. Definition types for google analytics can be downloaded from DefintelyTyped repository

more info about module resolution here

EDIT: according your comment maybe you will have to add modul export to google definition file

declare module 'googleAnalytics' {
    export = UniversalAnalytics;
}

edited May 15 '16 at 21:14

answered May 15 '16 at 20:47

Stanislav Šolc

306
3
8

2

Manually creating a folder in `node_modules` is a very bad practice. You should rarely (if not never) have modify this folder. The typescript compiler also looks for [ambiant module declarations](https://www.typescriptlang.org/docs/handbook/modules.html#working-with-other-javascript-libraries), which is what @jasonszhao proposed, but it seems like the google analytics type definition doesn't export anything. – Maxime Dupré May 15 '16 at 20:57
1

Excellent i didn't know it. – Stanislav Šolc May 15 '16 at 21:10
As a follow up to your edit: you are right, but it would be `export = ga` instead of `export = UniversalAnalytics `. Cheers! – Maxime Dupré Jun 02 '16 at 03:15

Typescript can't find a module that has been mapped with SystemJS

2 Answers2