How can I compel npm to resolve dependencies flatly?

I am working on a project where multiple frontends share a common library.

The module dependencies for these projects are managed using npm.

In the package.json file of each project, I specify:

  "dependencies": {
    "mylib": "file:../<...path...>/mylib",
    ...other dependencies...
  },

I utilize "mylib" for two main purposes :

  • sharing certain classes;
  • sharing common dependencies (mostly Angular).

Previously, with npm version 3.3.12, after running npm install, the Angular dependencies of mylib were directly under the node_modules directory of my top level projects.

For example:

node_modules
    @angular
        core
        common
        ...
    mylib

However, in the current npm version 5.4.2, the structure has changed to:

node_modules
    mylib
        node_modules
            @angular
                core
                common

This change is causing issues in my build process, requiring additional TypeScript configuration such as:

"baseUrl": "",
"paths": {
    "@angular/common": ["node_modules/mylib/node_modules/@angular/common/"],
    "@angular/core": ["node_modules/mylib/node_modules/@angular/core/"],
    ...
    }

This becomes cumbersome when configuring for AOT, rollup, etc...

I attempted to simplify this by using npm dedupe. However, due to the numerous dependencies, it takes over 10 minutes for just one project:

npm dedupe
...
...
removed 824 packages and moved 1020 packages in 623.196s

Is there an efficient standard way to achieve the previous flattening of dependencies without the time-consuming process of npm dedupe?

Answer №1

If you're looking for a different approach than using npm, consider making the switch to yarn. This should automatically deduplicate modules. To get started, delete your current node_modules folder and run yarn install.

You can also opt for a flat installation with yarn install --flat, but in most cases, a standard installation should suffice.

Make sure to include the yarn.lock file in version control so that all checkouts will have the same module versions unless they decide to use yarn upgrade.

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

When using the npx command, the <package> runs successfully in the command line but does not function properly within the scripts section

After installing a package in Node with npm i mypackage --save-dev, everything runs smoothly through the command line using npx mypackage --options. However, when attempting to include it in the scripts section of package.json, it fails. Various attempts w ...

Getting node siblings within an Angular Material nested tree: A comprehensive guide

Struggling to retrieve the list of sibling nodes for a specific Angular Material tree node within a nested tree structure. After exploring the Angular Material official documentation, particularly experimenting with the "Tree with nested nodes," I found t ...

Migration of Angular dynamic forms project - The error "input" does not have an initializer or a constructor, and another issue with Type T | undefined

Angular dynamic forms project migration - encountering Type T | undefined error In my quest to find a sample project demonstrating the creation of Angular forms using JSON datasets, I stumbled upon this repository: https://github.com/dkreider/advanced-dyn ...

Angular: determining if the current route or page is secured by a guard

I am currently working with Angular 9 and I was wondering if there is a way to determine if the current page is protected or guarded during the APP_INITIALIZER phase. Within my APP_INITIALIZER setup, I need to be able to identify whether the route being a ...

What is the best way to manage errors and responses before passing them on to the subscriber when using rxjs lastValueFrom with the pipe operator and take(1

I'm seeking advice on the following code snippet: async getItemById(idParam: string): Promise<any> { return await lastValueFrom<any>(this.http.get('http://localhost:3000/api/item?id=' + idParam).pipe(take(1))) } What is the ...

No input in ng2-select2

How can I reset the value in ng2-select2 by clicking on a button? Here is my current HTML code: <select2 id="bill" [data]="colBill" [options]="option" (valueChanged)="onBillArray($event);"> The corresponding Typescript code is: this.arrBill = []; ...

Why does tsc produce a compiled file that throws an exception when executed, while ts-node successfully runs the TypeScript file without any issues?

I have written two ts files to test a decorator. Here is the content of index.ts: import { lockMethod } from './dec'; class Person { walk() { console.info(`I am walking`); } @lockMethod run() { console.info(`I am running`); } ...

tips for utilizing a variable for inferring an object in typescript

In my current code, I have the following working implementation: type ParamType = { a: string, b: string } | { c: string } if ('a' in params) { doSomethingA(params) } else { doSomethingC(params) } The functions doSomethingA and doSomething ...

Effortlessly apply mapping, filtering, reducing, and more in JavaScript

Array#map and Array#filter both create a new array, effectively iterating over the original array each time. In languages like rust, python, java, c#, etc., such expression chains only iterate once, making them more efficient in certain cases. While this ...

Typescript: Streamline the process of assigning types to enum-like objects

One common practice in JavaScript is using objects as pseudo-enums: const application = { ELECTRIC: {propA: true, propB: 11, propC: "eee"}, HYDRAULIC: {propA: false, propB: 59, propC: "hhh"}, PNEUMATIC: {propA: true, propB: ...

Tips for streamlining a conditional statement with three parameters

Looking to streamline this function with binary inputs: export const handleStepCompletion = (userSave: number, concur: number, signature: number) => { if (userSave === 0 && concur === 0 && signature === 0) { return {complet ...

How can HostBinding be used to target a custom directive in order to deliver either a success or error message and show it on

I am incorporating a custom directive to display specific server messages/errors following an http request. For example, in the response or error section, I want to target the custom directive and present the emphasized message. The directive is already e ...

Having trouble getting `sudo apt install npm` to work? You might be encountering the error message "The following packages have unmet dependencies

Creating dependency tree Retrieving status information... Completed Certain packages could not be installed. This might indicate that you have requested an unrealistic scenario or if you are utilizing the unstable version, some necessary packages could s ...

Unable to simultaneously execute TypeScript and nodemon

Currently, I am in the process of developing a RESTful API using Node.js, Express, and TypeScript. To facilitate this, I have already installed all the necessary dependencies, including nodemon. In my TypeScript configuration file, I made a modification to ...

The element within the iterator is lacking a "key" prop, as indicated by the linter error message in a React component

Encountering an error stating Missing "key" prop for element in iteratoreslintreact/jsx-key {[...Array(10)].map((_) => ( <Skeleton variant="rectangular" sx={{ my: 4, mx: 1 }} /> ))} An attempt to resolve this issue was made ...

What are the best methods for protecting a soda?

My code is in strict mode, and I am encountering an issue with the following snippet: const a: string[] = []; // logic to populate `a` while (a.length > 0) { const i: string = a.pop(); // This line is causing an error console.log(i); // additio ...

Applying multiple classes and conditions with Angular's NgClass directive

I am currently working on implementing a feature where the class name of a component within a div can be changed based on a button click. There are approximately five CSS classes that I would like to toggle on and off using ng-class. My main question is ...

Exploring PrimeNG's method for expanding and collapsing groups

I'm attempting to incorporate two buttons that can be used to either expand or collapse all the groups in my code utilizing primeNG. Below is the functioning code: PLUNKER <p-dataTable [value]="data" sortField="room" rowGroupMode="subheader" grou ...

Utilizing process.env in VueJS 2 with the help of Vite

I am currently in the process of transitioning an existing Vue-2 project to Vite using @vitejs/plugin-vue2 One issue I have encountered is that process.env is not defined. I understand that I need to utilize import.meta.env, which works fine. However, the ...

The npm publish command is not utilizing the private AWS CodeArtifact repository as intended

I am facing an issue with my Jenkins job where I am trying to push an npm package to a private AWS CodeArtifact repository. It works fine on my local machine, but when run through Jenkins, it fails with errors. The setup in Jenkins is to use a container as ...