NPM installs different version from package.json

Question

For our Electron app we need a specific version of pixi.js (5.0.0-rc.3). In our package.json we therefore specified "pixi.js": "^5.0.0-rc.3",.

When we run npm install now and open our app then the welcome message by pixi and the package-lock.json state version 5.0.4. We tried removing the node_modules folder and reinstalling all modules but it still got the wrong version.

Our import statement in the html file is const PIXI = require('pixi.js'); and this should get the locally installed version of pixi if I am not mistaken.

Is this a bug? Or is it on purpose (if yes, which purpose)?

Update

As there are some answers and comments now, here's what we further tried so far:

Delete package-lock.json, node_modules folder (locally and globally) and ran npm i again
Reinstall NodeJS (LTS)
Tested everything with current version of NodeJS
Removed the '^' from the package.json as it is ok with any version in the range installing
Tested it on another Windows 10 machine and on macOS

Update 2

There are three answers now and none could solve the problem so far, I'm starting to believe that this isn't my fault, but may be a bug with Pixi JS. I opened an issue on their GitHub page, maybe they can help.

can you try again removing`package-lock.json` and/or `npm-shrinkwrap`? — Aritra Chakraborty, Jun 28 '19 at 10:30
If you have a package-lock.json, running `npm ci` instead of `npm install` will never mutate the package.json / package-lock.json and should guarantee same versions. — k0pernikus, Jun 28 '19 at 10:38
You actually specified you want version `5.anything..`. If you ONLY want `5.0.0-rc.3` specify `"pixi.js": "5.0.0-rc.3"` -- remove the `^` sign — slebetman, Jun 28 '19 at 11:32
@slebetman Thank you for the tip! Sadly this didn't fix the error. — creyD, Jun 28 '19 at 15:44
I've tested it on my machine and can 100% guarantee that installing pixi.js 5.0.0-rc.3 does not install version 5.0.4. Are you sure you've removed the old 5.0.4 version from your disk? Npm will not remove files from your disk. Running `npm install` will not downgrade pixi.js. You need to delete everything (normally the node_modules directory but I don't know your Electron build pipeline) and run `npm install` again — slebetman, Jun 29 '19 at 05:06
I reinstalled node JS 10.16. on my machine, deleted the local and the global node_modules folder, changed the entry to `"pixi.js": "5.0.0-rc.3",`, deleted the package-lock file and ran NPM install again and it still shows 5.0.4 in the console and the package-lock file. I'm using Windows 10 latest version. — creyD, Jun 29 '19 at 09:17
I tried this with the latest version of node JS now, still doesn't work. — creyD, Jun 29 '19 at 10:04

Aritra Chakraborty · Answer 1 · 2019-06-28T18:29:31.253

1

If you want to install specific version don't use ~ or ^ in package.json, use the version exactly

The tilde ~ matches the most recent patch version (the third number) for the specified minor version (the second number).
~1.2.3 will match all 1.2.x versions but will hold off on 1.3.0.

The caret ^ is more relaxed. It matches the most recent minor version (the second number) for the specified major version (the first number).
^1.2.3 will match any 1.x.x release including 1.3.0, but will hold off on 2.0.0.

In your case: "pixi.js": "5.0.0-rc.3"

From: What's the difference between tilde(~) and caret(^) in package.json?

edited Jun 28 '19 at 18:29

answered Jun 28 '19 at 10:36

Aritra Chakraborty

12,123
3
26
35

Thank you very much! Sadly I did all the steps and it still installs the 5.0.4. I'm really bummed as I thought that this was the problem... :| – creyD Jun 28 '19 at 15:43
I tried to install manually, it installed. So, maybe you can install it manually. – Aritra Chakraborty Jun 28 '19 at 18:15
I tried this aswell, after removing it from the `package.json` but in the app it still shows 5.0.4. What did your `package-lock.json` state after your ran this? – creyD Jun 28 '19 at 18:27
Removing that bit, in my package lock it is shown `5.0.4` not 5.0.0. Maybe you need to direct npm install from github. I will check and post it here. Maybe this is pixi.js's problem, not yours. – Aritra Chakraborty Jun 28 '19 at 18:29
Yeah same happens on my PC. Maybe they redirected everyone from the `5.0.0-rc-3` to `5.0.4` because of a bug or something similar. – creyD Jun 28 '19 at 18:31
@creyD That sounds very unlikely. Are you sure you've deleted the node_modules directory and ran npm-install again? – slebetman Jun 29 '19 at 05:01
@slebetman yeah I did. I deleted the local and global node_modules, reinstalled nodeJS (therefore npm), deleted package-lock and reran `npm install` and the console still states version 5.0.4, as does the newly created package-lock. – creyD Jun 29 '19 at 09:18
The console even shows during install `> pixi.js@5.0.0-rc.3 postinstall PATH\node_modules\pixi.js > node scripts/support-pixi.js` – creyD Jun 29 '19 at 09:22

score 0 · Answer 2 · edited Jul 01 '19 at 14:03

Original Answer

If you absolutely need that version you should:

update your package.json file to "pixi.js": "5.0.0-rc.3".
Delete the existing package-lock.json or npm-shrinkwrap.json file.
Rerun npm i

By doing this you are pinning your dependency to that specific version.

Also check out this semver calculator. You can load the pixi.js package. Then enter 5.0.0-rc.3 and ^5.0.0-rc.3. It will show you how the ^ changes the behavior of finding matches.

I've found that the calculator often visually helps to understand semver math better than reading the docs does for some folks.

Hope this helps!

Updated Answer

If you look at the package-lock.json file and look at the dependencies for pixi.js all of the dependencies use the ^ and are not pinning the version to 5.0.0-rc3. Instead, they are being forced up to the latest patch version, which is 5.0.4 and a setting on NPMs/ pixis side, not yours.

    "pixi.js": {
      "version": "5.0.0-rc.3",
      "resolved": "https://registry.npmjs.org/pixi.js/-/pixi.js-5.0.0-rc.3.tgz",
      "integrity": "sha512-+B6ZMvJNEz/IoiC+BrwP9PsDonEAj4TOZw+yuZ/K8WQokcSm9uAp3PJ+6eFFWTjnkxsAcMP9tgldmDdTFoAF7w==",
      "requires": {
        "@pixi/accessibility": "^5.0.0-rc.3",
        "@pixi/app": "^5.0.0-rc.3",
        "@pixi/constants": "^5.0.0-rc.3",
        "@pixi/core": "^5.0.0-rc.3",
        "@pixi/display": "^5.0.0-rc.3",
        "@pixi/extract": "^5.0.0-rc.3",
        "@pixi/filter-alpha": "^5.0.0-rc.3",
        "@pixi/filter-blur": "^5.0.0-rc.3",
        "@pixi/filter-color-matrix": "^5.0.0-rc.3",
        "@pixi/filter-displacement": "^5.0.0-rc.3",
        "@pixi/filter-fxaa": "^5.0.0-rc.3",
        "@pixi/filter-noise": "^5.0.0-rc.3",
        "@pixi/graphics": "^5.0.0-rc.3",
        "@pixi/interaction": "^5.0.0-rc.3",
        "@pixi/loaders": "^5.0.0-rc.3",
        "@pixi/math": "^5.0.0-rc.3",
        "@pixi/mesh": "^5.0.0-rc.3",
        "@pixi/mesh-extras": "^5.0.0-rc.3",
        "@pixi/mixin-cache-as-bitmap": "^5.0.0-rc.3",
        "@pixi/mixin-get-child-by-name": "^5.0.0-rc.3",
        "@pixi/mixin-get-global-position": "^5.0.0-rc.3",
        "@pixi/particles": "^5.0.0-rc.3",
        "@pixi/polyfill": "^5.0.0-rc.3",
        "@pixi/prepare": "^5.0.0-rc.3",
        "@pixi/runner": "^5.0.0-rc.3",
        "@pixi/settings": "^5.0.0-rc.3",
        "@pixi/sprite": "^5.0.0-rc.3",
        "@pixi/sprite-animated": "^5.0.0-rc.3",
        "@pixi/sprite-tiling": "^5.0.0-rc.3",
        "@pixi/spritesheet": "^5.0.0-rc.3",
        "@pixi/text": "^5.0.0-rc.3",
        "@pixi/text-bitmap": "^5.0.0-rc.3",
        "@pixi/ticker": "^5.0.0-rc.3",
        "@pixi/utils": "^5.0.0-rc.3"
      }
    },

It looks like if you want this to work, and I would really just advise you to update your app to work with the updated package instead of doing this, you'll need to

fork pixi.js at the 5.0.0-rc3 tag, https://github.com/pixijs/pixi.js/tree/v5.0.0-rc.3
Update the package.json file to make all of it's dependencies 5.0.0-rc.3 instead of ^5.0.0-rc.3
Create a dependency on your forked repository instead of the published npm module.

Thank you very much! Sadly I did all the steps and it still installs the 5.0.4. — creyD, Jun 28 '19 at 15:43
BTW: the semver calculator only showed the 5.0.0-rc.3 and nothing else. — creyD, Jun 29 '19 at 10:09
I think I see what the issue is. I updated my answer to reflect what I'm seeing. — Travis, Jul 01 '19 at 12:01

score 0 · Accepted Answer · edited Jan 09 '20 at 23:07

TL;DR The solution is to explicitly specify the exact versions of the @pixi sub-modules in your package.json like this:

"dependencies": {
  "@pixi/core": "5.0.0-rc.3",
  ... (all other pixi submodules here) ...
  "pixi.js": "5.0.0-rc.3"
}

Detailed explanation:

You are installing pixi.js module version 5.0.0-rc.3, but this is actually just a container for a bunch of pixi sub-modules with their own versions. The sub-module dependencies are specified like @pixi/core": "^5.0.0-rc.3"; the ^ causes npm to grab more recent versions.

I was able to control the version of the sub-modules by adding them to the package.json file, next to the dependency for pixi.js

Here are the steps I used to confirm what was happening and to list the pixi sub-modules:

npm init -y                             ## Create empty npm module
npm install pixi.js@5.0.0-rc.3 --save --save-exact  ## Add pixi.js
cat package-lock.json                   ## See below

...
    "@pixi/core": {
      "version": "5.0.4",
      "resolved": "https://registry.npmjs.org/@pixi/core/-/core-5.0.4.tgz",
      "integrity": "sha512-P2K2JJC+BFZrRZT9P0+Ir8jd7VrH6w7/L1Njg2+iSetW9TdjkPahR+w93VGwpEzEkrYHoNs6FbSFCY38P/6g8A==",
      "requires": {
        "@pixi/constants": "^5.0.4",
        "@pixi/display": "^5.0.4",
        "@pixi/math": "^5.0.4",
        "@pixi/runner": "^5.0.4",
        "@pixi/settings": "^5.0.4",
        "@pixi/ticker": "^5.0.4",
        "@pixi/utils": "^5.0.4"
      }
    },
...
    "pixi.js": {
      "version": "5.0.0-rc.3",
      "resolved": "https://registry.npmjs.org/pixi.js/-/pixi.js-5.0.0-rc.3.tgz",
      "integrity": "sha512-+B6ZMvJNEz/IoiC+BrwP9PsDonEAj4TOZw+yuZ/K8WQokcSm9uAp3PJ+6eFFWTjnkxsAcMP9tgldmDdTFoAF7w==",
      "requires": {
        "@pixi/accessibility": "^5.0.0-rc.3",
        "@pixi/app": "^5.0.0-rc.3",
        "@pixi/constants": "^5.0.0-rc.3",
        "@pixi/core": "^5.0.0-rc.3",
        "@pixi/display": "^5.0.0-rc.3",
        "@pixi/extract": "^5.0.0-rc.3",
        "@pixi/filter-alpha": "^5.0.0-rc.3",
        "@pixi/filter-blur": "^5.0.0-rc.3",
        "@pixi/filter-color-matrix": "^5.0.0-rc.3",
        "@pixi/filter-displacement": "^5.0.0-rc.3",
        "@pixi/filter-fxaa": "^5.0.0-rc.3",
        "@pixi/filter-noise": "^5.0.0-rc.3",
        "@pixi/graphics": "^5.0.0-rc.3",
        "@pixi/interaction": "^5.0.0-rc.3",
        "@pixi/loaders": "^5.0.0-rc.3",
        "@pixi/math": "^5.0.0-rc.3",
        "@pixi/mesh": "^5.0.0-rc.3",
        "@pixi/mesh-extras": "^5.0.0-rc.3",
        "@pixi/mixin-cache-as-bitmap": "^5.0.0-rc.3",
        "@pixi/mixin-get-child-by-name": "^5.0.0-rc.3",
        "@pixi/mixin-get-global-position": "^5.0.0-rc.3",
        "@pixi/particles": "^5.0.0-rc.3",
        "@pixi/polyfill": "^5.0.0-rc.3",
        "@pixi/prepare": "^5.0.0-rc.3",
        "@pixi/runner": "^5.0.0-rc.3",
        "@pixi/settings": "^5.0.0-rc.3",
        "@pixi/sprite": "^5.0.0-rc.3",
        "@pixi/sprite-animated": "^5.0.0-rc.3",
        "@pixi/sprite-tiling": "^5.0.0-rc.3",
        "@pixi/spritesheet": "^5.0.0-rc.3",
        "@pixi/text": "^5.0.0-rc.3",
        "@pixi/text-bitmap": "^5.0.0-rc.3",
        "@pixi/ticker": "^5.0.0-rc.3",
        "@pixi/utils": "^5.0.0-rc.3"
      }
    },
...

Thank you for your answer! I specified it in package.json and removed the lock and node_modules and ran `npm i` but my package-lock doesn't look like yours and if I open the app it still shows 5.0.4. By now I'm really sorry, I hoped your solution would work :| — creyD, Jun 30 '19 at 11:53
If I do the exact steps like you did in a new app, the package-lock looks the same tho! — creyD, Jun 30 '19 at 11:56
@creyD I added a note to my answer because I had trouble composing a long comment from the mobile app. — Leftium, Jun 30 '19 at 14:36
Oh wait! I have to add every submodule to the package.json? I thought the overall module and core were enough. Gonna try it now! — creyD, Jun 30 '19 at 14:44
This actually worked and solved the problem. I added all the dependencies and modules and reinstalled and the version was finally 5.0.0-rc.3 — creyD, Jun 30 '19 at 16:19

score 0 · Answer 4 · edited Sep 09 '21 at 10:11

I ran into similar issue where instead of required tildify 2.0.0 it was always installing 3.0.0 version.
Note -
I have been trying updating package.json file manually to change the version but that did not help. Here are the commands I used that finally saved my day -

Step 1 - Remove node_modules folder manually

Step 2 - from your package.json directory, run this command to uninstall the package

npm uninstall <package_name>

example -

npm uninstall tildify

Step 3 - from your package.json directory, run this command to install the package with exact version

npm install <package_name>@<package_version> --save-dev --save-exact

example -

npm install tildify@2.0.0 --save-dev --save-exact

NPM installs different version from package.json

4 Answers4