What could be causing this error for my NPM module in a .NET Core project using Typescript?

My Typescript configuration seems to be causing some issues, even though everything works fine without TS. Could the problem lie in my .d.ts file? And do I really need it for webpack?

I have a basic NPM module:

index.js:

var MyMathTS = function(a, b){
    this.sum = a + b;
};
exports = MyMathTS;

index.d.ts:

declare class MyMathTS {
    constructor(x: number, y: number);
 sum(x: number, y: number) : number;
} 

This is the code in main.ts:

import "mymathts16";

var mm = new MyMathTS(2, 3);
console.log(mm);

The output from webpack displays:

/******/ ([
/* 0 */
/***/ (function(module, exports) {

var MyMathTS = function(a, b){
    this.sum = a + b;
};

exports = MyMathTS;




/***/ }),
/* 1 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_mymathts16__ = __webpack_require__(0);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_mymathts16___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_mymathts16__);

var mm = new MyMathTS(2, 3);
console.log(mm);


/***/ })
/******/ ]);

However, when I check the console, I encounter this error message:

https://i.sstatic.net/n0OmV.png

Interestingly, Angular doesn't seem to have any issues.

Answer №1

My issue with exporting has been successfully resolved using export default MyMathTS.

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

Is npm required if Bower package cannot be found?

As I embark on my journey with Bower, I'm in the process of setting up a mock project. After initializing my project and installing jQuery and gulp to kick things off, everything seems to be going smoothly. These dependencies have been successfully ad ...

Is there a way to check if a date of birth is valid using Regular Expression (RegExp) within a react form?

const dateRegex = new RegExp('/^(0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])[- /.] (19|20)\d\d+$/') if (!formData.dob || !dateRegex.test(formData.dob)) { formErrors.dob = "date of birth is required" ...

Default Media Types Supported by ASP.NET Controller

I've encountered an issue with my controller that currently only returns data in XML format. Here is a snippet of the code: [Produces(MediaTypeNames.Application.Xml)] public class MyController { /* implementation details */} Now, I want to also be a ...

Explore the world of data manipulation in Angular by experimenting with different

Embarking on a fresh Angular 2 project centered around Photos and Users. The backend work is all done, with the API in place. I've already constructed those classes. Now, I find myself pondering... To manipulate these objects on the client end, wo ...

Do we need to import Vue in every component when using Nuxt with TypeScript?

I recently integrated TypeScript into Nuxt using the guidelines provided in the documentation: However, I have a specific question regarding component setup. Should I always include import vue from "vue" and export default Vue.extend ({}); in al ...

Utilizing useClass in Angular's APP_INITIALIZER

Before my application starts up, I require some API data and am currently handling it with APP_INITIALIZER and useFactory. However, I aim to enhance the structure by separating all the code from app.module.ts: app.module.ts import { NgModule} from '@ ...

Move files into the designated folder and bundle them together before publishing

Is there a way to transfer the files listed in package.json (under the File field) to a specific folder in order to bundle them together with npm publish? Here is the structure of my repository: . ├── package.json └── folder0 ├── fil ...

The data path "" should not include any extra properties, specifically rebaseRootRelativeCssUrls

I recently started using Angular and encountered an issue while trying to update some packages. Despite my efforts to find a solution, I haven't come across any helpful answers yet. Here is the Error => Schema validation failed with the following ...

The compatibility between Babel 7 and the preset-es2015 is not very reliable

After reading this useful tutorial on implementing server-side rendering with create-react-app, I attempted to execute the following code snippet: require('ignore-styles'); require('babel-register')({ ignore: [/(node_modules)/], ...

Tips for enhancing a TypeScript interface for a React component in (Material-UI) by utilizing styled-components

I've been struggling to find a solution for this overload issue with no luck so far. My stack includes Typescript, Styled-components, and Material-UI. I am utilizing styled(MUIButton) to extend the default Button from MUI. While my props are being pas ...

What is the best way to hand off this object to the concatMap mapping function?

I'm currently in the process of developing a custom Angular2 module specifically designed for caching images. Within this module, I am utilizing a provider service that returns Observables of loaded resources - either synchronously if they are already ...

Disabling dynamic color updates upon refresh

I am currently using chartjs and I want to generate new random colors each time the page is refreshed. However, I need these colors to remain fixed and not change after a page refresh or reload. Below is the function I am working with: getRandomRgb() { ...

Quickest method for sorting an array of objects based on the property of another object's array

Within my code, I have two arrays of objects, both containing a "columnId" property. My goal is to rearrange the first array to match the order of the second. I attempted the following method: filtered = visibleColumns.filter(function(v) { re ...

Error message received when making an API call in React Native for Android and saving the response to a local database: 'Error: Network

Despite using axios and promises to make a call to a local database API, I am facing difficulties reaching the endpoint as I constantly receive a 'Error: Network Error' feedback in the console without any further explanation on the root cause of ...

What is the syntax for typing a mongoose populated field in Typescript?

I am faced with a field that can either be an ID or have a value, and I am attempting to type this field using TypeScript import { InferSchemaType, Schema, Types, model } from 'mongoose'; const personSchema = new Schema({ _id: Schema.Types.Obj ...

Encountering an issue: "Failed HTTP response while trying to access https://localhost:44328/api/AllItProjectsLists/Index: 0 Error Message Unknown"

I am completely new to working with Angular. I have been working on a small application that is supposed to display a list of projects retrieved from a database on the Angular side. To achieve this, I am making a call from Angular to .NET Core 2.2. The dat ...

The local types package cannot be built by react-scripts even though tsc has successfully completed the process

I have developed an application with a TypeScript frontend and backend. To streamline the process, I decided to create a shared types module that contains all the necessary types for both components in one centralized location. Rather than going through th ...

Leveraging a shared library in Typescript

How can I efficiently share code between different codebases that are all written in TypeScript and constantly being developed? I am seeking a straightforward solution. Some of the methods I have attempted include: 1 Utilizing import statements with path ...

Tips for creating a TypeScript function that is based on another function, but with certain template parameters fixed

How can I easily modify a function's template parameter in TypeScript? const selectFromObj = <T, S>(obj: T, selector: (obj: T) => S): S => selector(obj) // some function from external library type SpecificType = {a: string, b: number} co ...

Scrolling through a list in Angular using cdk-virtual-scroll-viewport while selecting items via keyboard input

Looking to implement a customized Autocomplete feature. As the user begins typing, a small window should appear with selectable options. I want users to have the ability to navigate and select an option using their keyboard. For instance: - User types "H ...