TypeScript "Cannot find module" errors

[benempson]

Hi there, I'm currently upgrading our custom code to TypeScript and trying to use AlertJS within that. I have downloaded the TypeScript definitions and used an import statement to bring them into the file where I am using the Alert/Dialog. When I type the import statement, the auto-complete happily completes the path to the alert.d.ts file without problems, however I then get an error beside the import statement stating "Cannot find module ./../../XRM/alert' despite the fact that this path is absolutely correct, and the same path used in the import statement, the import statement itself does not show any error (which it does do if I change the path to something incorrect by underlining the path in red). I am also able to use Alert/Dialog calls in code and the auto-complete function works and there is no red underlining on lines that reference Alert/Dialog, indicating that VS Code/TypeScript understands where the definition file is and is using it.

I am using Mocha for testing and Rollup for build, both of these are erroring with the same problem that they cannot resolve the alert.d.ts file.

Here you can see where the module is defined correctly, with VS Code bizarrely showing a "cannot find module" error, while showing the correct module path beneath that error:

And here you can see the error when I make a deliberate spelling error to show how a "real" error looks:

I am totally stumped with this, AlertJS is the only library with which I am having any type of problem. If you have any idea what could be causing this I'd really appreciate any help!

Regards, Ben

[PaulNieuwelaar]

Hi Ben, which version of the alert.js file are you using? And do you have a reference to the actual .js file in your project as well?

[PaulNieuwelaar]

Here's some more info about what else needs to be included in the project: https://github.com/PaulNieuwelaar/alertjs/wiki/Documentation-v3.0#typescript-definition

[benempson]

Hi Paul, I'm using version 2.1, implemented several years ago and with no need for Dialog functionality. I do not have a reference to the .js file no, I guess this must be the error? I guess also that I will need to convert the .js file to TypeScript in order for it to be compatible. I will do this and come back.

Wrt https://github.com/PaulNieuwelaar/alertjs/wiki/Documentation-v3.0#typescript-definition, this only gave me the location of the TypeScript definition file, I'm not using PCF controls so I don't see any other relevant info there...

[PaulNieuwelaar]

Hi Ben, Ah yeah the TypeScript definition was created from 3.1+ and it hasn't been tested with 2.1 (which we no longer support). In theory it should still work as the solutions are backwards compatible, as long as you don't use the 3.0+ features. Only thing that may have issues is the jQuery reference as v2.1 tries to get this from the parent page, which may not exist in a ts project.

You'll need to include the js/img/css files in your project manually. You shouldn't need to convert the js to ts. Just make sure the folder structure matches the CRM solution, e.g. /alertjs/js/alert.js, /alertjs/js/alert.d.ts, /alertjs/css/alert.css, /alertjs/img/alert.png, /alertjs/img/alert.gif. Then when you import the alert module it should match up with the other files.