Override npm package dependency

Question

I read this: How do I override nested NPM dependency versions?

Unfortunately, it does not solve my problem.

I am trying to change a package from using a specific dependency to use another version of that dependency.

Is it built into a package what version of a dependency it should use, or is it possible to change it?

In my case specifically, I am trying to change css-loader's default dependency on [email protected] (latest) to instead be dependent on [email protected] (next).

From the second answer in the above link, user trickpatty notes that:

this will be removed anytime you run npm i instead of editing your package-lock.json and adding the child dependency to "dependencies" there, add the child dependency to your package.json "dependencies" section

Including [email protected] in package.json's devDependencies does nothing to css-loader. It still uses the other (default) version of cssnano.

Answer 1

NPM 8 introduced "overrides" which allows you to override specific transitive dependencies of your direct dependency. For your usecase, you would declare something like below in your package.json.

{
  "overrides": {
    "css-loader": {
      "cssnano": "4.0.0-rc.2"
    }
  }
}

More details @ https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides

Answer 2

There are several alternatives:

• If you can use different package manager, yarn has an option to achieve it by adding to the package.json:

"resolutions": {
    "package-a": "2.0.0"
}

• If you can use latest Node LTS and NPM 8: https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides

• Otherwise, you can use some tool like https://github.com/mislavlukach/flatten-dependencies that runs on postinstall script to fix your problem of different nested dependencies versions. You will need to install that version as dependency in your project.

EDIT: Found another alternative: https://www.npmjs.com/package/npm-force-resolutions