CODEWITHSUNDEEP
typescript
HMR
HMR

Reputation: 39340

Typescript Cannot find module

Filter.ts, mustache.js and redux.3.5.2.js are in the same directory (/Scripts). The Filter.ts has the following code:

///<reference path="./typings/mustache.d.ts" />
import Mustache = require("mustache");
import Redux = require("redux.3.5.2");

In Visual studio code it shows an error on redux cannot find module. When I compile it it says:

Filter.ts(13,24): error TS2307: Cannot find module 'redux.3.5.2'.

So how is it able to find mustache but not redux?

I did not add a typing file yet but how would that affect importing the file? It is not yet used anywhere in code? Also removing the mustache typing does not result in typescript not finding the file.

$ ls *.js
requirejs.2.1.22.js  Filter.ts              mustache.js          redux.3.5.2.js

[Update]

Did an update of typescript:

npm install -g typescript

tsc.cmd now tells me I have Version 1.8.10

My task.json looks like:

{
    "version": "0.1.0",
    "command": "tsc.cmd",
    "isShellCommand": true,
    "showOutput": "silent",
    "problemMatcher": "$tsc"
}

and tsconfig.json looks like:

{
    "compilerOptions": {
        "target": "es5",
        "watch": true,
        "module": "amd",
        "removeComments": true,
        "sourceMap": false,
        "outDir": "."
    }
}

Now Visual studio code complains it cannot find any of my required modules and tsc.cmd complains it still cannot find module 'redux.3.5.2'. Luckily after a couple of restarts of Visual studio code those errors went away but it is still not able to find redux. I'm not sure if it cannot find the file or something in the file is causing this problem because the error does not specify what the exact problem is.

Upvotes: 2

Views: 20880

Answers (2)

HMR
HMR

Reputation: 39340

The JavaScript file does not matter, put a definition file (for example: module-name.d.ts) in the root.

Now your ts file can contain the following:

///<reference path="module-name.d.ts" />
import redux = require("module-name");

In require.config you can do the following:

require.config = {
  baseUrl:settings.appRoot,
  urlArgs: "version=" + settings.version,
  paths: {
    "module-name" :   settings.appRoot + "/Scripts/SomePlace/some-module",
...

If you put the type definition in one directory (for example typings) then the ts file would look like this:

///<reference path="../typings/module-name.d.ts" />
import redux = require("typings/module-name");

If another ts file requires this module but the ts file is in another directory (let's see one deeper) then you can do the following:

///<reference path="../../typings/module-name.d.ts" />
import redux = require("typings/module-name");

Your require.config will look like:

require.config = {
  baseUrl:settings.appRoot,
  urlArgs: "version=" + settings.version,
  paths: {
    "typings/module-name" :   settings.appRoot + "/Scripts/SomePlace/some-module",
...

Upvotes: 0

basarat
basarat

Reputation: 276353

So how is it able to find mustache but not redux

I can see in your code you have ///<reference path="./typings/mustache.d.ts" />. So you do have typings for mustache and hence it is found. I don't see any typings for redux in your sample, hence not found.

Upvotes: 1

Related Questions