Generating npm package without including file extensions in imports

I am currently working on creating an internal library for my workplace.

Everything seems to be going smoothly until I try to use it in another project. It appears that the file extension in all of the import statements has disappeared during the npm pack phase.

To illustrate, the statement:

import * as Account from './modules/account.js'

turns into:

import * as Account from './modules/account'

This change causes the import to fail.

Initially, I thought this issue might have occurred because I used the .js extension instead of .mjs, but even switching to .mjs produces the same problem.

main.js

import * as Account from './modules/account.js'

Account.secretSquirrel().then( data => console.log( 'inspector gadget', data ) );

node version

v16.15.0

package.json (confidential information hidden)

{
  "name": "@Nunya",
  "version": "0.0.0",
  "description": "Nunya",
  "private": true,
  "main": "./lib/main.js",
  "scripts": {
    "build": "npm run pack",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "Nunya.git"
  },
  "author": "Nunya",
  "license": "ISC",
  "type": "module",
  "exports": {
    ".": {
      "require": "./lib/main.js",
      "default": "./lib/main.js"
    },
    "./Account": "./lib/modules/account.js"
  }
}

Based on my analysis, this discrepancy should not be occurring. I am unsure how to address it

Answer №1

It appears that the solution to resolving this issue involves including an import object that sets the resolutions for relative paths in the package.json. While I believe there may be an automated method to achieve this, I am currently unaware of it.

If you have any insight on this matter, kindly share with me.

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

Launch the sidebar window using jQuery

I've been attempting to create something similar to this. However, I'm having trouble replicating it exactly. What I've attempted I've managed to create a replica, but the issue is that the buttons are fixed. Could setting the left ...

Retrieve a file from an AWS S3 bucket using AngularJS

Currently utilizing angularjs. I am in need of incorporating a download feature. <button class="btn btn-labeled btn-info" title="download"> <a href="link provided by s3" download="downloaded">Download</a> </button> I have ...

Having trouble retrieving data from mongo db collection - data not found

For my eCommerce application, I am using MongoDB and Angular. The requirement is to retrieve items under each user in the cart. However, when trying to fetch the data using the object ID as a reference, it seems unable to find any data from the database. ...

"Is there a way to retrieve the CSS of all elements on a webpage by providing a URL using

Currently, I am in the process of creating a script that can crawl through all links provided with a site's URL and verify if the font used on each page is helvetica. Below is the code snippet I have put together (partially obtained online). var requ ...

The progress bar seems to be malfunctioning

Need help with my progress bar, it's not working properly. Can someone assist me? var x = document.getElementById("p_bar"); for(var i = 0; i < 100; i++) { var wid; wid=1; if(wid == 800) break; else wid+=8; x.style.width=wid+" ...

Ui Bootstrap (angularjs) sidebar is not functioning properly

I am encountering an issue with a sidenav that I am in the process of creating for one of my projects. The goal is to develop a side menu that shifts the content to the right when opened and returns it to the left when closed, essentially functioning as a ...

"An error has occurred: The file already exists" message is displayed while attempting to execute the initial command for Remix.run

I am not very familiar with the npx command, but as far as I understand, it is a way to execute NPM packages, a step required in the Getting started guide from the Remix.run web framework. It's quite frustrating to be stuck on the first step where I ...

Send a response from socket.io to the client's browser

I am working on a project where I need to retrieve the ID of the current drawer from the server and pass it to the client. Here is the code I have so far: Client Side: socket.emit('returnDrawer'); socket.on('returnDrawer', fu ...

Is there a way to pass information from Express.js to React without using an API?

My goal is to build a Multi Page APP using both react and express. I find myself uncertain about how to access data sent by express in react without utilizing an API. I am curious if react has the capability to retrieve information stored in HTML props t ...

Easy task tracker in Vue.js

I’m currently delving into the world of VueJS and working on a simple to-do list application. The issue I’m facing is that I can't seem to successfully pass an array to the child component responsible for displaying the list: Parent Component < ...

Utilizing v-data-iterator in Vuetify to display data fetched from an API in a table

After a long day of searching and experimenting, I've finally arrived here. Initially, I attempted to create a simple table with 2 columns using Row and iterate over the object to populate the left column with its keys. However, I hit a roadblock when ...

Selecting content loaded via Ajax using jQuery

I recently implemented a library that I found at this website According to the documentation, I need to use the following syntax: autosize($('textarea#description')); This works fine for regular elements, but when my textarea is loaded via aja ...

Add the onclick() functionality to a personalized Angular 4 directive

I'm facing an issue with accessing the style of a button in my directive. I want to add a margin-left property to the button using an onclick() function in the directive. However, it doesn't seem to be working. Strangely, setting the CSS from the ...

Is there a way to create a universal getter/setter for TypeScript classes?

One feature I understand is setting getters and setters for individual properties. export class Person { private _name: string; set name(value) { this._name = value; } get name() { return this._name; } } Is there a w ...

What is the best way to search for a specific string within an Airtable record that may also have additional data included?

By utilizing the filterByFormula method in the airtable api, I am able to query and choose records that include a specific item (string). However, this query will only return the records that exclusively have that particular string. Referencing the airtab ...

How to use jQuery to maintain an image at the top of a div

Within my HTML, there is a primary root div element containing an image. <div id="root"> <img id="msg"/> </div> Using jQuery, I am able to prepend multiple div elements inside the main root div. However, the problem arises when these ...

The object is not defined when trying to evaluate `_reactNavigation.ThemeColors.light`

Currently, I am working on atome and utilizing NPM with react-native. Encountered an error while trying to launch the application: Received a TypeError stating that undefined is not an object when evaluating '_reactNavigation.ThemeColors.light&apo ...

What is the iPad version of the onmousemove event?

I am currently facing an issue with a website on my iPad. Everything seems to be in order except for the onmousemove method. I am looking for a way to have onmousemove activated when the user swipes their finger across the screen. ...

error: unexpected token } in Node.js syntax

I am struggling to identify my issue! /var/www/html/bot# nodejs driver /var/www/html/bot/driver.js:2239 }); ^ SyntaxError: Unexpected token } at createScript (vm.js:80:10) at Object.runInThisContext (vm.js:139:10) at Module._co ...

A guide on expanding an HTML table dynamically with MVC razor syntax

My goal is to dynamically add new rows to a table by following the advice given in this answer on Stack Overflow: Add table row in jQuery I have successfully implemented it for one of my table requirements as seen below: function onAddItem() { $( ...