It appears that when importing from a shared package in lerna, the name must include "src" at the end for Typescript or Javascript files

I am currently working on a straightforward lerna project structure as shown below:

Project
 |    
 +-- packages
 |  |  
 |  +-- shared
 |  |  |
 |  |  +-- src
 |  |       |  
 |  |       +-- index.ts
 |  |       +-- someDir   
 |  |
 |  +-- usesShared
 |
 +

In my index.ts file, I have exports like:

export * from "./someDir";

However, when importing a class from someDir in the "usesShared" class, I find myself having to include /src at the end of the import statement:

import {GreatClass} from "myShared/src";

As someone new to TypeScript, JavaScript, and lerna, this approach feels incorrect. It seems like it should be simpler:

import {GreatClass} from "myShared";

Could anyone offer guidance on how to address this issue? Is this related to lerna configuration or am I overlooking something in the package.json file?

Answer №1

In the "shared" directory, create a new file named index.ts:

export * from "./src";

To import the class from the usesShared module:

import { GreatClass } from "../myShared";

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

Removing all repetitions from an array in JavaScript

My collection of objects includes the following inputs: var jsonArray1 = [{id:'1',name:'John'},{id:'2',name:'Smith'},{id:'3',name:'Adam'},{id:'1',name:'John'}] There is a dupl ...

Using Typescript in NextJS 13 application router, implement asynchronous fetching with async/await

Recently, I implemented a fetch feature using TypeScript for my NextJS 13 project. As I am still getting familiar with TypeScript, I wanted to double-check if my approach is correct and if there are any potential oversights. Here is the code snippet from ...

Which superclass does ReadonlyArray extend from?

Looking at this TypeScript code snippet: const arr: ReadonlyArray<string> = [ "123", "234" ]; arr.push("345"); An error is thrown by the TS compiler: Property 'push' does not exist on type 'ReadonlyArray<string>&apo ...

Tips for saving user input from an HTML form into a database using PHP, and then transferring it to a variable in JavaScript

I've been working on a Wordpress project that involves two separate pages. The first page has a form for users to submit their name, which is then stored in a custom table in the database. After submitting the form, the user is redirected to another p ...

Acquire request data prior to exiting function in React

I am working on a NextJS application that utilizes axios for making requests to a backend API, which requires an authentication token. To handle this, I have implemented a function that retrieves the auth token and stores it in a variable at the module-lev ...

Any suggestions on how to address vulnerabilities in npm when upgrading the main dependency version is not an option?

I recently ran the npm audit --production command and found a high-risk vulnerability related to the snowflake-sdk dependency. After checking the snowflake github page, I noticed that the package.json file includes "requestretry": "^6.0.0&qu ...

Best practices for selecting checkboxes and transferring values to another page in PHP/HTML

Apologies for my lack of experience in PHP. I am in the process of creating a project without any knowledge of PHP. I have set up a database with a list of users and can display users based on specific information through a search. Each search query has a ...

What are the differences between ajax loaded content and traditional content loading?

Can you explain the distinction between the DOM loaded by AJAX and the existing DOM of a webpage? Is it possible to load all parts of an HTML page via AJAX without any discrepancies compared to the existing content, including meta tags, scripts, styles, e ...

Is there a way to eliminate the mongoose event listener registered onConnect in the Socket.io Leak issue?

Whenever a user connects via socket.io, the following subscribe event is triggered: socket.on('subscribe', function(room) { console.log('joining room', room.id); socket.join(room.id); socket.roomName = room.id; // ...

Typed NextJs navigation to a specific route

<Link href="/about"> <a>About Us</a> </Link> Is there a way to ensure type safety with NextJs links? Currently, it is challenging to restructure the Link component as it is just a string. I stumbled upon this repos ...

Add a JQuery function to the button element in the HTML code

Currently, I am experimenting with AJAX to load a series of consecutive pages within a main page. The process is illustrated in the image below: Thanks to the guidance from this community, I have learned how to call content from other pages by utilizing t ...

"Resetting the state of a form in AngularJS2: A step-by

Looking to reset the form state from dirty/touched in angular? I am currently delving into the world of angular2 and working on a form with validation. In my journey, I came across this code snippet: <form *ngIf="booleanFlag">..</form> This ...

Customizable form fields in AngularJS

Consider the scenario of the form below: First Name: string Last Name: string Married: checkbox % Display the following once the checkbox is selected % Partner First Name: Partner Last Name: [Submit] How can a form with optional fields be created in Angu ...

Numerous asynchronous requests running simultaneously

After successfully querying a database using js/ajax for a single drop-down, I am now looking to enhance my solution by adding multiple identical drop-downs. The goal is to retrieve the same information when an option is selected without allowing duplicate ...

Express route not capturing entire request parameter due to regex issue

I am pretty sure that the issue lies in how express handles regex patterns in route definitions, although it might also be related to my pattern (I'm still new to regex, so please bear with me). In my express route definition, I am attempting to match ...

The API is returning a successful response code of 200 when the HEAD and OPTIONS methods are utilized

My API is up and running smoothly with a GET method in express. This is the code for my API: app.get('/healthcheck', (_req, res) => { res.status(200).send({ state: 'Healthy', timestamp: new Date(), uptime: process.upti ...

When using Vue.js router.push, the URL gets updated but the RankerDetail component does not refresh when navigating with a button

I am currently working on a Vue.js project that involves vue-router, and I've encountered an issue with the RankerDetail component. This particular component is responsible for dynamically displaying data based on the route parameter id. Strangely, wh ...

I'm encountering an issue with my Next.js development server at localhost:3001 where all routes are displaying a 404 not found page. What

Currently working on a Next.js dashboard app and encountering an issue where my localhost keeps redirecting me to the 404 page. This has happened before, but I can't recall how I resolved it. Here is the recurring problem: I attempted deleting the .n ...

Bringing in a selection of functions as an object using ES6 imports

functions.js export const setA = () => {...} export const setB = () => {...} export const setC = () => {...} component.js import {setA, setB, setC} from 'functions' export class componentOne extends React.Component { constructor(p ...

Scrolling to ID or Anchor using jQuery: Automatically scrolls to the top if already at the designated section

I've been on a quest to uncover the cause and solution for this issue. Lately, I've been utilizing $("#content").animate({scrollTop:$(#elementId).offset().top-183}, 600); to achieve smooth scrolling to an ID within a <div>. The number 18 ...