There is no default export defined in Typescript

Currently, I am in the process of developing an npm module that serves as a basic logger. The initial implementation was done using plain JS:

logger.js

class Logger {
  // additional code
}

module.exports = Logger;

The above code works seamlessly in a JavaScript script like so:

logger-test.js

const Logger = require('ep-logger');

const logger = new Logger('my-logger');
logger.info('yo');

However, the team at our company predominantly uses TypeScript. To adapt to this, alongside my logger.js, I also created a file named logger.d.ts with the following structure:

export interface SplunkOptions {
    endpoint?: string
    loggingSource?: string
    loggingSourceType?: string
}

export interface LoggerOptions {
    stage?: string
    level?: string
    splunk?: SplunkOptions
}

export default class Logger {
    constructor(name: string);

    public static setOptions(obj: LoggerOptions): void;

    public error(message: string | Error, ...data: any[]): void;
    public warn(message: string | Error, ...data: any[]): void;
    public info(message: string | Error, ...data: any[]): void;
    public verbose(message: string | Error, ...data: any[]): void;
    public debug(message: string | Error, ...data: any[]): void;
    public silly(message: string | Error, ...data: any[]): void;
}

To align with TypeScript requirements, I made changes in my package.json:

{
  // more package.json configurations go here
  "main": "src/logger.js",
  "types": "src/logger.d.ts"
}

When attempting to use the logger in my TypeScript project, I encountered an issue:

index.ts

import Logger from 'ep-logger';

const logger: Logger = new Logger('my-logger');
logger.info('yo');

An error message indicating absence of default export for the logger arose:

{ Error: Command failed: ts-node local-lambda.ts --colors

/Users/luke/Arbeit/WeltN24/Editorial Products/projects/ep-logger-tests/js-app/yo-lambda/src/index.ts:5 const logger: Logger = new Logger('my-logger'); ^ TypeError: ep_logger_1.default is not a constructor ...

In order to investigate further, I executed

console.log(Logger);

And the output was

undefined

Answer №1

When using typescript version 2.6 or lower, it is necessary to define your file with an export assignment rather than a default export:

export interface SplunkOptions {
    //...
}

export interface LoggerOptions {
    //...
}

export class Logger {
    //...
}

export = Logger;

There are indications that this will change in the upcoming version (2.7), and the original method you used will be supported (causing issues with export =), initially requiring the --strictESM flag, then becoming the default behavior from version 2.8 onwards.

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 there a way to validate an input field and display error messages using a TypeScript file instead of directly in the HTML file within Angular 4?

I am just starting out with Angular, so please bear with me if my question seems basic. I'm eager to learn and hopeful that I can find the answers I need here. Currently, I have implemented validation for an input field that captures a user's Fi ...

Retrieving Data from Vuetify Component within vue 3

Currently, I am in the process of creating my own wrapper for Vuetify components to eliminate the need to repeatedly define the same props in each component. For example, I aim to develop a custom TextField with defaultProps while still being able to accep ...

Exploring the power of Vue3 with reactive nested objects and the inclusion of

It seems like I've encountered a bit of a challenge... Perhaps a bug in Vue3 with Typescript and the composition API, or maybe I'm missing something. I'm facing an issue where I'm not getting any intellisense in my IDE (Webstorm) when ...

Angular is disregarding certain JSON fields when creating objects

My goal is to fetch data from the wagtail API, but it returns the JSON in a complex format. { "id": 3, "meta": { "type": "home.HomePage", "detail_url": "http://localhost:8000/api/v1/pages/3/" }, "parent": null, "title": ...

Angular 4 animation issue: duration of transitions not being properly implemented

Why isn't the transition working as expected? Even though the animate function is set with a time of 2 seconds, the transition happens instantly. trigger('showMenu', [ state('active', style({ marginLeft: '0px' }) ...

Tips for transitioning from Angular to Angular 2: Overcoming key challenges

Our current Angular project is highly developed, but with the emergence of Angular 2 and its advanced features and improved performance, we are considering migrating our existing work. However, we are concerned about the potential challenges that may ari ...

Learn how to trigger an event or API call in Angular 8 when the browser is closed with the help of HostListener

I am facing the challenge of calling a simple websocket closure API when the browser is closed in my project. I attempted to utilize HostListener, but unfortunately it did not work as expected. You can find the code snippet below: https://stackblitz.com/ ...

Creating a dynamic calendar application with Angular 2 using PrimeNG components

After diving into PrimeNG, I diligently followed the instructions on their documentation to get everything set up. However, my UI ended up looking quite odd, similar to the image below. Does anyone have any insight as to why this might be happening? Here ...

Steps for Signing Up for a Collaboration Service

I'm struggling to understand how to monitor for new values in an observable from a service. My ultimate objective is to integrate an interceptor, a service, and a directive to show loading information to the user. I have set up an interceptor to liste ...

What is the process for passing a URL from a component and assigning it as the new service URL?

Hello, I am new to Angular and I am trying to pass a URL from a component and set it as the new service URL. Here is my code: pokemon.service.ts private _url: string = "https://pokeapi.co/api/v2/pokemon"; constructor(private http : HttpClient) { } ...

Implement a query in Mongoose using the Schema First methodology within NestJS

In the beginning, I must mention that this query bears resemblance to this one which points to this particular question. My inquiry mirrors the second link with a noticeable distinction. I am endeavoring to expand a class produced by NestJS which delineate ...

What is the trick to maintaining the chiplist autocomplete suggestions visible even after inserting or deleting a chip?

After creating an autocomplete chiplist component in Angular, I noticed that when a user adds or removes an item, the suggestion list disappears and the input field is cleared. However, I would prefer to keep the autocomplete list open (or reopen it) so t ...

In TypeScript, use a key index signature for any properties that are not explicitly defined

In various instances, I have encountered scenarios where it would have been beneficial to implement the following (in a highly abstracted manner): export interface FilterItem { [key: string]: string | undefined; stringArray?: string[]; } However, thi ...

Ensure that typescript examines the context of 'this' within unrestricted functions

I'm having trouble getting Typescript to detect an error in the code snippet below: function foo() { console.log(this.x.y) } foo() When I run it using npx ts-node a.ts, there are no Typescript errors displayed, but it naturally fails with TypeEr ...

What is the secret to getting this nested observable to function correctly?

Currently, I am working on an autocomplete feature that dynamically filters a list of meals based on the user's input: export class MealAutocompleteComponent { mealCtrl = new FormControl() filteredMeals: Observable<Array<Meal>> live ...

The data type 'string | number | boolean' cannot be assigned to type 'undefined'. Specifically, the type 'string' is incompatible with type 'undefined'. Error code: ts(2322)

When attempting to create a partial object with specific fields from a full object that meet certain criteria, I encountered a TypeScript error message. To better explain this issue, I designed a test module to showcase the concept/problem without using ac ...

Error: The reference to "global" is undefined and was not caught in the promise

After successfully running my project, I encountered an issue upon installing the aws-sdk package from here. Despite trying to find solutions online, I have been unable to resolve this problem. The error message I am facing is: core.js:1673 ERROR Error ...

What could be causing the issue with dayjs dynamic importing in TypeScript?

Currently, I am developing a web screen within a .NET application and facing an issue with sending datetime preferences from the system to the web screen using CefSharp settings. AcceptLanguageList = CultureInfo.CurrentUICulture.Name In my TypeScript code ...

Error message: "Trying to assign a value to a property that is not defined in Angular

I am encountering an issue while trying to set the reviews for an Angular 2 project. When I try to assign a value to this.reviews = targ, I receive an error message: TypeError: Cannot set property 'reviews' of undefined. However, I know that targ ...

How to troubleshoot the issue of "Property not found in type 'Vue'"

I am currently utilizing Typescript along with Vuejs to create an application. I have multiple independent components (.vue) files that I am bringing in to a Typescript (.ts) file. Within the Typescript file, I am importing Vue from the npm Vue library and ...