Vue-cli: vue cli fails to get packages when npm is using a custom nexus npm registry

[Ealdst]

Version

4.3.1

Environment info

System:
    OS: Windows 10 10.0.18362
    CPU: (8) x64 Intel(R) Xeon(R) CPU E3-1505M v6 @ 3.00GHz
  Binaries:
    Node: 12.16.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.16.0 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.14.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: 44.18362.449.0
  npmPackages:
    @fortawesome/vue-fontawesome: ^0.1.9 => 0.1.9
    @vue/babel-helper-vue-jsx-merge-props:  1.0.0
    @vue/babel-plugin-transform-vue-jsx:  1.1.2
    @vue/babel-preset-app:  4.3.1
    @vue/babel-preset-jsx:  1.1.2
    @vue/babel-sugar-functional-vue:  1.1.2
    @vue/babel-sugar-inject-h:  1.1.2
    @vue/babel-sugar-v-model:  1.1.2
    @vue/babel-sugar-v-on:  1.1.2
    @vue/cli-overlay:  4.3.1
    @vue/cli-plugin-babel: ^4.3.1 => 4.3.1
    @vue/cli-plugin-eslint: ^4.3.1 => 4.3.1
    @vue/cli-plugin-pwa: ^4.3.1 => 4.3.1
    @vue/cli-plugin-router:  4.3.1
    @vue/cli-plugin-unit-jest: ^4.3.1 => 4.3.1
    @vue/cli-plugin-vuex:  4.3.1
    @vue/cli-service: ^4.3.1 => 4.3.1
    @vue/cli-shared-utils:  4.3.1
    @vue/component-compiler-utils:  3.1.2
    @vue/eslint-config-airbnb: ^5.0.2 => 5.0.2
    @vue/preload-webpack-plugin:  1.1.1
    @vue/test-utils: ^1.0.0-beta.32 => 1.0.0-beta.32
    @vue/web-component-wrapper:  1.2.0
    eslint-plugin-vue: ^6.2.2 => 6.2.2
    jest-serializer-vue:  2.0.2
    svg-to-vue:  0.6.0
    vue: ^2.6.11 => 2.6.11
    vue-analytics: ^5.22.1 => 5.22.1
    vue-autosuggest: ^2.0.4 => 2.0.4
    vue-bus: ^1.2.1 => 1.2.1
    vue-carousel: ^0.18.0 => 0.18.0
    vue-cli-plugin-i18n: ^0.6.1 => 0.6.1
    vue-cli-webpack:  1.0.0
    vue-clickaway: ^2.2.2 => 2.2.2
    vue-cookies: ^1.7.0 => 1.7.0
    vue-eslint-parser:  7.0.0
    vue-headroom: ^0.10.1 => 0.10.1
    vue-hot-reload-api:  2.3.4
    vue-i18n: ^8.16.0 => 8.16.0
    vue-i18n-extract:  1.1.1
    vue-i18n-ts:  0.1.0
    vue-jest:  3.0.5
    vue-loader:  15.9.1
    vue-router: ^3.1.6 => 3.1.6
    vue-social-sharing: ^2.4.7 => 2.4.7
    vue-style-loader:  4.1.2
    vue-svg-loader: ^0.15.0 => 0.15.0
    vue-template-compiler: ^2.6.11 => 2.6.11
    vue-template-es2015-compiler:  1.9.1
    vue-youtube: ^1.4.0 => 1.4.0
    vuex: ^3.1.3 => 3.1.3
  npmGlobalPackages:
    @vue/cli: Not Found

Steps to reproduce

Add a custom registry which requires authentication in .npmrc, then use vue ui and check plugins/dependencies or try to upgrade a plugin with vue upgrade.

What is expected?

In the case of vue ui the current package version and details on the latest version should be displayed.

What is actually happening?

A 401 error is returned when checking the package in the registry, along with the error "Failed to get response from https://my-nexus-repository.com/repository/npm-proxy/the-package-name"

---

It looks to me like the registry value is taken from the .npmrc file but not the credentials included in the _auth string. I am not behind any proxy and am able to revert my registry to default settings as a workaround but would be much better if I could use this functionality without having to constantly change settings.

[bodograumann]

Just got a quite similar problem with latest v4.4.1. I am mostly using the public npm registry, but have some vue plugins in a private registry based on the package scope.
Now when trying to vue upgrade, vue cli is looking for these in the public registry instead of the private one and ofc not finding them:

⠧ Gathering package information... ERROR Failed to get response from https://registry.npmjs.org/@private-scope/vue-cli-plugin-private-package
ERROR StatusCodeError: 404 - {"error":"Not found"}

I think i remember that it used to work at some point though...

[sodatea]

Ah, right. Because Vue CLI used to call yarn info or npm info to get the package metadata underlyingly. Later it was refactored for performance concerns. (Starting a subprocess is very slow on Windows, and in the UI page for "dependencies" there might be tens of simultaneous calls to getMetadata)

[rigogsilva]

Same issue here. Up.

[abarke]

Seems we have a similar issue. The error is however a 406 Not Acceptable from Artifactory.

We use an self-hosted artifactory to get our packages. When I use yarn or npm to install packages it works fine and I have set npm and yarn global config to use our internal Artifactory. Our Artifactory does not require authentication.

$ vue -V
@vue/cli 4.4.4

$ vue upgrade
\  Gathering package information... ERROR  Failed to get response from https://artifactory.company.com/api/npm/npm/@vue/cli-plugin-babel
 ERROR  StatusCodeError: 406 - {"errors":[{"status":406,"message":"Not Acceptable"}]}
StatusCodeError: 406 - {"errors":[{"status":406,"message":"Not Acceptable"}]}
    at new StatusCodeError (C:\Users\abarker\AppData\Roaming\npm\node_modules\@vue\cli\node_modules\request-promise-core\lib\errors.js:32:15)
    at Request.plumbing.callback (C:\Users\abarker\AppData\Roaming\npm\node_modules\@vue\cli\node_modules\request-promise-core\lib\plumbing.js:104:33)
    at Request.RP$callback [as _callback] (C:\Users\abarker\AppData\Roaming\npm\node_modules\@vue\cli\node_modules\request-promise-core\lib\plumbing.js:46:31)
    at Request.self.callback (C:\Users\abarker\AppData\Roaming\npm\node_modules\@vue\cli\node_modules\request\request.js:185:22)
    at Request.emit (events.js:198:13)
    at Request.<anonymous> (C:\Users\abarker\AppData\Roaming\npm\node_modules\@vue\cli\node_modules\request\request.js:1154:10)
    at Request.emit (events.js:198:13)
    at IncomingMessage.<anonymous> (C:\Users\abarker\AppData\Roaming\npm\node_modules\@vue\cli\node_modules\request\request.js:1076:12)
    at Object.onceWrapper (events.js:286:20)
    at IncomingMessage.emit (events.js:203:15)

[sodatea]

Fixed in v4.4.5

[abarke]

Awesome. Hope this will fix the issue for my use case.

[Ealdst]

Can confirm everything is now working for me as expected, thanks!

[abarke]

Initial testing with GitBash in Windows:

$ vue upgrade
-  Gathering package information...
 ERROR  TypeError: Cannot convert undefined or null to object
TypeError: Cannot convert undefined or null to object
    at Function.keys (<anonymous>)
    at PackageManager.getRemoteVersion (C:\Users\abarker\AppData\Roaming\npm\node_modules\@vue\cli\lib\util\ProjectPackageManager.js:271:16)
    at process._tickCallback (internal/process/next_tick.js:68:7)

[sodatea]

Seems still an authorization error (the request to https://artifactory.company.com/api/npm/npm/@vue/cli-plugin-babel returns a valid json but no actual metatdata fields like dist-tags). I need to improve the error message.

Have you run npm login to log into your internal npm registry?

In v4.4.5 I tried to read the npm auth token from ./.npmrc, ~/.npmrc and $PREFIX/.npmrc and then include it in the request header. This should work for most use cases IMO.

[sodatea]

This implementation is consistent with the npm documentation, but may be not in line with the one implemented in yarn - it also checks upper level directories for .npmrc.
So there are small chances that yarn works in your project while vue upgrade doesn't.

[abarke]

npm login is not required as we dont need to login to retrieve packages only to publish.

If I go to the URL in the browser then I see the JSON:

{
"_id": "@vue/cli-plugin-babel",
"_rev": "116-c33b0dd0cd4298671154374a64664971",
"name": "@vue/cli-plugin-babel",
"description": "babel plugin for vue-cli",
"dist-tags": {
"next": "4.4.1",
"latest": "4.4.5"
},
"versions": {
"4.1.1": {

[abarke]

npm and yarn registry in the global config point to the same host.
npm and yarn work out of the box without npm login

[sodatea]

What's the result of curl https://artifactory.company.com/api/npm/npm/@vue/cli-plugin-babel -H "Accept: application/vnd.npm.install-v1+json" vs curl https://artifactory.company.com/api/npm/npm/@vue/cli-plugin-babel -H "Accept: application/json"?

If the first one failed, then it's your registry does not support this accept header… Maybe I should also append application/json to the header.

[abarke]

Indeed the first request returns:

{
  "errors" : [ {
    "status" : 406,
    "message" : "Not Acceptable"
  } ]

The second request with application/json returns the expected result.

[sodatea]

@abarke Fixed in v4.4.6

[bodograumann]

Sorry, but I still have the same problem as posted above @sodatea .
vue upgrade is looking for a custom vue plugin with custom npm scope, not in the configured private registry, but in the official registry.nmpjs.org and does not find it of course.
I can create a new ticket if you feel it is a separate issue.

[abarke]

@sodatea it's working for me now. Thanks for the fix.

[sodatea]

@bodograumann If the config in the ~/.npmrc is in the format of @myco:registry=http://reg.example.com, then it's because I forgot to handle such cases. I'll try to fix it in the next version.

[gangsthub]

Still failing for me in @vue/[email protected], when running serve:

 ERROR  Failed to get response from https://npm.pkg.github.com/company_edited/vue-cli-version-marker

I have a .npmrc in the root of the project with:

registry=https://npm.pkg.github.com/company_edited

Because we are using the Github package registry for private packages:

But I can install plugins in the UI with no hassle.

[a0m0rajab]

I got the same error :)

[a0m0rajab]

I got the same error :)

[a0m0rajab]

I got the same error :)

[a0m0rajab]

I got the same error :)

[mahermali]

I have the same issue with Nexus it looks like vue upgrade is not considering the _auth in .npmrc
the solution was to enable the anonymous access on nexus temporarily

[bodograumann]

@mahermali, are you using at least version 4.5.7 of vue-cli? My changes in #5892 should have fixed the problem.

[mahermali]

@bodograumann I didn't see the new release I'm using 4.5.6 thanks I'll give it a try

[vilbergs]

If people are running into this when using vue upgrade then you can append the public npm registry in the command.

vue upgrade --registry https://registry.npmjs.org