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

Answer 3

The following in your package.json can help you here. How it works is that it overrides all the versions of cssnano that css-loader requests with the version you've specified instead.

See the docs

"overrides": {
  "css-loader": {
     "cssnano": "1.2.3"
   }
}

Answer 4

In package.json you can add resolutions and give the path of dependency which was used. This is example from my project:

{
  "resolutions": {
    "helmet/helmet-csp": "2.9.1",
    "jest/**/handlebars": "4.5.3"
  }
}

Answer 5

This thread is a bit old and maybe already resolved, but maybe there is someone with the same question.

In my opinion, you should not change the dependency versions of your dependencies. Each project is developed, tested, and published considering their declared dependency versions. You could break or change the behavior of a package changing its dependencies externally.

Instead, think in making a fork of the project (css-loader), change the dependency version, test by yourself, and do use your fork. You can also open a pull request to the project maintainer (if you think the change will benefit the community) or publish your version (respecting the licensing policy).