Effortless transfer of a module from one TypeScript file to another

I'm facing an issue with importing classes from one .ts file to another .ts file.

Here is the structure of my project:

I'm attempting to import print.ts into testing.ts

This is how my tsconfig.json appears:

The contents of my testing.ts are:

import { names } from 'testing';
console.log(names.printFirstName());

The contents of my print.ts are:

class nameCollection {
static printFirstName(){
    return 'OYEAAAH';
    };
}

export {nameCollection as names};

I am executing my tests using: node testing.js

But I encountered:

Appreciate any help!

Answer №1

When utilizing Typescript, it's important to understand how path mapping works for module resolution. Avoid mixing directories and files.

{
  "compilerOptions": {
    "paths": {
      "testing/*": ["src/nested/*"]
    }
  }
}

To properly import in your scripts, use

import {names} from 'testing/print';

For more information, refer to https://www.typescriptlang.org/docs/handbook/module-resolution.html

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

Learn how to send or submit data using the Form.io form builder

I am currently working on a dynamic drag and drop form builder, and I'm struggling to figure out how to log the data from the form. Below is the component.html file where I am implementing the drag and drop form: <div> <form-builder ...

What is the best way to address dynamic meta tags in Angular server-side rendering (SSR

My Angular application uses server side rendering, and I am dynamically loading the meta tags content from the backend. Despite seeing the proper content in the HTML, Facebook's debugger does not seem to recognize the tags. Has anyone else encountered ...

Having trouble setting up my Angular Universal server, need assistance please

Having trouble starting the server, encountering this issue: [email protected] serve:ssr D:\PROGRAMMING\CMSfrontbackup node dist/CMSfront/server/main.js D:\PROGRAMMING\CMSfrontbackup\dist\CMSfront\server\m ...

Angular 5 is throwing an error that says: "There is a TypeError and it cannot read the property 'nativeElement' because it

Being aware that I may not be the first to inquire about this issue, I find myself working on an Angular 5 application where I need to programmatically open an accordion. Everything seems to function as expected in stackblitz, but unfortunately, I am enco ...

Could one potentially assign number literals to the keys of a tuple as a union?

Imagine having a tuple in TypeScript like this: type MyTuple = [string, number]; Now, the goal is to find the union of all numeric keys for this tuple, such as 0 | 1. This can be achieved using the following code snippet: type MyKeys = Exclude<keyof ...

Creating a dynamic configuration for service instantiation in Angular 4/5

Currently working on a library that has an AuthModule with an AuthService for managing OAuth2 authentication using oidc-client-js. I want the application using this library to be able to set up the configuration for the OAuth client. One way to do this is ...

Adding a new value to a string variable using TypeScript

Just starting out with Angular and I'm looking to capture user input from a text box with each keystroke and add it to a string variable like in Java. In my text box, I have the following setup for capturing key events: <input type="text" ...

Explore visuals in the component repository

I am currently working on an Angular 7 component library and am facing some challenges in adding images for buttons and other elements. My project structure is organized as follows: projects components src lib myComponent assets ...

Update the data in Firebase, but revert it back to the original state after a few seconds with the use of "angularFire."

I'm currently working on updating data in the Firebase Realtime Database using Angular and AngularFire. The issue I'm facing is that even though the data changes successfully, it reverts back to the original data after a few seconds. Below is the ...

Dynamic URL used in TRPC queries`

Is there a way to query a single post in TRPC and Next JS based on a dynamic url without using SSR or SSG? I have tried adding as string to router.query.id but encountered a TRPC error (only happening during the first load) because router.query.id is ini ...

Is it possible to expand the Angular Material Data Table Header Row to align with the width of the row content?

Issue with Angular Material Data Table Layout Link to relevant feature request on GitHub On this StackBlitz demo, the issue of rows bleeding through the header when scrolling to the right and the row lines not expanding past viewport width is evident. Ho ...

What steps can I take to fix the ESM / require error while using TypeScript 4.8?

My Node.js application uses TS 4.8, and I recently updated the file-type package. However, after the update, my project compilation fails with the following error: [1] const _fileType = /#PURE/ _interopRequireWildcard(require("file-type")); [1] ...

How to Retrieve Class Variables in Angular 2 Form Validator Function

I'm in the process of creating a modal-driven form with custom validation requirements. Specifically, I want to ensure that the user's password meets certain criteria (including having an uppercase letter, lowercase letter, and number). Instead o ...

Differences between Typescript Import and JavaScript import

/module/c.js, attempting to export name and age. export const name = 'string1'; export const age = 43; In b.ts, I'm trying to import the variables name and age from this .ts file import { name, age } from "./module/c"; console.log(name, ...

Despite reaching a video readystate of 4 in HTML5, the video still hangs and does not play smoothly

Using html5, I am currently working with video and audio. I have encountered an issue where sometimes the video hangs even after its readyState === 4. The cause of this problem is unclear to me. I aim for a solution where if the video's readyState = ...

Angular 2 Popup Modal Issue: "Expression modified after checking"

See the problem in action on YouTube Check out the GitHub repository for the demo app My simple app consists of an app component, a child component (account), and an alert service that handles a message dialog component (popup modal). To demonstrate the ...

How to retrieve a value only if it is truthy in JavaScript or TypeScript - Understanding the operator

In React components, a common scenario arises with code like this: <Carousel interval={modalOpen ? null : 8000}> It would be great if I could simplify it to something along these lines (although it's not valid): <Carousel interval={modalOpen ...

typescript makeStyles() functions from material-ui library

I've been struggling to find the correct type without relying on any. I have a working code that styles the component as expected: import { makeStyles } from '@material-ui/core/styles' const useStyles = makeStyles((theme) => ({ mainC ...

Should the checkbox be marked, set to 1?

I am looking for a way to call a method when the user checks or unchecks multiple checkboxes. Do you have any suggestions on how I can achieve this? Here is what I have tried so far: <input type="checkbox" [ngModel]="checked == 1 ? true : checked == 0 ...

What is the best way to display information pulled from an API in Angular using ng2 charts?

Hello, can you lend me a hand? I'm currently facing an issue while attempting to display data using ng2 charts in my Angular application. The data is being fetched from a Firebase API, but unfortunately, it's not rendering properly and I can&apos ...