Do you have an index.d.ts file available for canonical-json?

I am currently working on creating an index.d.ts file specifically for canonical-json. Below is my attempted code:

declare module 'canonical-json' {
    export function stringify(s: any): string;
}

I have also experimented with the following snippets:

declare namespace JSON {
  export function stringify(s:any):string;
}

export = JSON;

And

export as namespace JSON;
export const stringify: (o:any) => string;

However, I keep encountering the error message:

canonical_json_1.stringify is not a function

This issue persists across all three attempts that I have made.

For reference, here is the Stackblitz link: https://stackblitz.com/edit/typescript-cryptojs?file=src%2F%40types%2Fcanonical-json%2Findex.d.ts

Answer №1

When dealing with a common js module, where the entire export is an object, you have multiple options for importing it. One approach is to use the specific syntax export =:

// src\@types\canonical-json\index.d.ts
declare module 'canonical-json' {
    function stringify(s: any): string;
    export = stringify;
}
// index.ts
import stringify = require('canonical-json');

Alternatively, you can enable "esModuleInterop": true to access the export as a default import:

// src\@types\canonical-json\index.d.ts
declare module 'canonical-json' {
    function stringify(s: any): string;
    export = stringify;
}
// index.ts
import stringify from 'canonical-json';

Another option is to define the module with just a default export, but remember to set "esModuleInterop": true since there is no actual default export in the module:

// src\@types\canonical-json\index.d.ts
declare module 'canonical-json' {
    export default function stringify(s: any): string;
}

// index.ts
import stringify from 'canonical-json';

Note: I tested these configurations in node, but they should work similarly in other environments as well.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Updating an element within a for loop using Angular TypeScript

I'm trying to figure out how to update the value of an HTML DOM element that is bound from a TypeScript file in each iteration of a for loop, rather than at the end of the loop. I want to see all values as the loop is running. For example, imagine I ...

Stripping the prefix from a string using the .split function leads to an error message stating "Unexpected

When dealing with a string containing a unique prefix, I attempted to separate it into an array after the backslash character "\" by using the split function. Here is the string: i:0#.w|itun\allepage_fg This was my approach: function claimOrder ...

When using $resource.save, it returns a "Resource" instead of just an ID

For some reason, I am struggling with a seemingly simple task and cannot find a solution by going through documentation or other Angular related questions on SO. I may not be the brightest, so I could really use some help here as I am feeling stuck. Take ...

The error message received states: "materialize-css Uncaught TypeError: Vel is not defined as

My current setup involves webpack as the bundler/loader, and I've successfully loaded materialize css (js/css). However, when attempting to use the toast feature, an error is thrown: Uncaught TypeError: Vel is not a function The library is being inc ...

Executing a sequence of jQuery's $.when().then() functions

I am facing challenges in understanding how to properly sequence my functions, especially in relation to the $.when() method. function y() { defer = $.Deferred(); $.when(defer).then(console.log(defer.state())); } y(); <script src="https://ajax.go ...

Craft a brief description for every individual component discovered

Is there a way to identify and shorten all elements containing a <tspan> tag to just ten characters each? For example: <tspan>Bla bla bla bla</tspan> <tspan>Bla bla bla bla</tspan> <tspan>Bla bla bla bla</tspan> ...

Type errors in NextJS are not being displayed when running `npm run dev`

When encountering a typescript error, I notice that it is visible in my editor, but not in the browser or the terminal running npm run dev. However, the error does show up when I run npm run build. Is there a method to display type errors during npm run d ...

Inefficiency in POST method prevents data transmission to MongoDB

I've developed a MERN application and now I'm testing the backend using the REST client vscode extension. This is how it looks: `POST http://localhost:4000/signup Content-Type: application/json { "email": "<a href="/cdn-cgi ...

Can text be inserted into an SWF file using ASP.NET or Javascript via an online platform?

I am managing a website that features videos created by a graphic designer who updates and adds new content regularly. I am looking to add dynamic text to these videos after a specific amount of time, such as "Hosted by XXX". However, I am hesitant to ask ...

'The signatures of each of these values are not compatible with one another.' This error occurs when using find() on a value that has two different array types

Here's the code snippet I'm attempting to run within a TypeScript editor: type ABC = { title: string } type DEF = { name: string } type XYZ = { desc: ABC[] | DEF[] } const container: XYZ = { desc: [{title: & ...

Issue with Highcharts failing to render points on regular intervals

I am facing an issue where the line graph in my frontend application using highcharts disappears or fails to draw to the next new data point every 30 seconds. Can anyone provide insight into why this might be happening? Check out the fiddle: http://jsfidd ...

What is the best method for pushing the most recent tag to the remote repository?

I get the process of pushing a tag by executing this command: git push origin v0.1.0 Now, I'm interested in finding a command that can automatically push the latest tag created without having to specify its name or number. ...

Tips for invoking an Android function from an AngularJS directive?

I am facing an issue with my HTML that uses an AngularJS directive. This HTML file is being used in an Android WebView, and I want to be able to call an Android method from this directive (Learn how to call Android method from JS here). Below is the code ...

Using Bootstrap, jQuery, and PHP to dynamically load input fields in a modal window

I am looking to dynamically load input fields in a modal window using PHP. While researching, I came across suggestions to utilize AJAX for this purpose. However, I have limited knowledge about AJAX. The plan is as follows: 1) When the user clicks on the ...

Top method for removing quotation marks from form input using jquery

Here is a form input that I need to handle: <tr class="formulaRow"> <input type="text" class="ingredient required" name="ingredient"> </tr> Currently, the value from this input is stored as follows: var ingredient = $(".formulaRow").fi ...

Is there a way to achieve this without relying on Ext.getCmp in this particular code snippet?

I am currently using the following code to trigger a button click event once the window show event is called. It works perfectly fine, but I want to achieve the same functionality without using Ext.getCmp. Here is the line of code: Ext.getCmp('recen ...

Can I bypass an invalid SSL certificate when making a request using a JavaScript library?

Is it possible to bypass invalid SSL certificates when using the widely-used request library? You can find more information about the library here: https://www.npmjs.com/package/request I am currently integrating this library into a Node.js server to send ...

Trouble with updating the view when an array is modified in ng-repeat? It seems like using $scope.$apply() may not

When updating the array inside a function, the view does not automatically update. However, if you use console.log to check the array after pushing values, it shows the updated array. Even trying $scope.apply() inside $timeout did not solve this issue. Ja ...

AngularJS - Unusual outcomes observed while utilizing $watch on a variable from an external AngularJS service

Within the constructor of my controllers, I execute the following function: constructor(private $scope, private $log : ng.ILogService, private lobbyStorage, private socketService) { this.init(); } private init(){ this.lobbyData = []; this.initial ...

Ajax request causing bootstrap success message to have shorter visibility

I encountered an issue with my ajax form that retrieves data using the PHP post method. Instead of utilizing the alert function in JavaScript, I decided to use a bootstrap success message. However, there is a problem as the message only appears for less th ...