Npm i @salesforce-ux/design-system - Exception com.fasterxml.jackson.core.exc.StreamConstraintsException

Sonatype Nexus Repository
,
9

I found a solution, maybe it isn’t the best, but is safer than workaround to go to an external registry and easier than using another private repo.

1. to follow the best practice and restrict the dependencies used we use the command ‘npm ci’. This will strictly use package-lock.json instructions.

2. Nexus seems to get an error when looking for @salesforcedx/design-system package because of this Version 2.21.2 (spring-23) contains a blob as readme and breaks all builds · Issue #756 · salesforce-ux/design-system · GitHub .

They might fix it in the next versions, that’s why we can used it when using npmjs registry, but as far as I could understand, I think when nexus is looking up for this package, it searchs for the version you want in to the general package url and not the specific version url.

making a test with curl test and as you can see below, the general url will have this broken readme (see on 2.1) and the specific curl (see on 2.2) doesn’t have this broken readme on the json file it gets.

2.1 curl https://registry.npmjs.org/@salesforce-ux/design-system/

output (partial):


(...)"readme":"\u001f�\b\u0000�W�d\u0000\u0003��r\u001bYz'8�)�)�K�`�\u0004��T�MQ�D�(�$Uս�\n �< �\u0005 љ\tR�ގ�3LLĬ������\u0013�#�w=��\u0004E�*�\u001b�\t��<��w���[M��Z;;ztp~�����|���ۃ�?�������������\u0015�wwv��\u001b���������N����v6w�;��h������ߢ�o5���7+������|��y1�\u001c\u0014\u001b\u000e�i�&�\u001e�����?�.��332Ii�I^�2Jf�u^d���j��f�ML�2����˵���L��u2�2��ju��ע8���3j���@3E�ܭ)L4-�MV��]\u0004U��ȤQ6��(��(�\u0007+\u0011�i�����(�z�tj&)\u0014���5\u0014��$�l�����$\u0015|\n���<\u001e}����rcugu��(��i\u0006�m�D\u001b락￧ro�/�|����/\u000f�\"-}�\u0013-a�������꺚�R��̮&�]Y�1M\u001ag\u0001c�T��\u0000�-Csq�i�Ґ�E��L\"X�ϰ\u0000Yu�Mh��\u0005η�^\\����v6w]�WPp֧��dd�a^\fL<��ƽ��=v=Ϊ5�����;\u001bM��A�M+\u0019\u0004�\u0007&\u0017M��\u001a��\n�����\u0016��G7&�ϲQ\u001a���\u000b؍�l

2.2 curl https://registry.npmjs.org/@salesforce-ux/design-system/2.22.2 

{"license":"BSD-3-Clause","config":{"slds":{"internal":false}},"private":false,"slds":{"name":"Winter ’24","id":"246","dependencies":{"@salesforce-ux/sds-styling-hooks":"1.1.0-alpha.2","@salesforce-ux/design-system-parser":"^1.1.1","@salesforce-ux/build-server-api":"2.1.7","@salesforce-ux/design-system-primitive-tokens":"0.3.6","@salesforce-ux/instant-vrt":"2.0.0","@salesforce-ux/postcss-annotations-parser":"0.1.1","@salesforce-ux/scss-parser-aura":"^3.1.1","@salesforce-ux/postcss-css-variable-value":"0.2.0","@salesforce-ux/design-system-markup":"^2.0.4","@salesforce-ux/sds-styling-aliases":"0.2.4","@salesforce-ux/icons":"10.7.0","@salesforce-ux/create-snap":"0.0.7"}},"repository":{"type":"git","url":"git+ssh://git@github.com/salesforce-ux/design-system.git"},"keywords":["Salesforce","Lightning Design System","Design System","CSS"],"author":{"name":"Salesforce"},"name":"@salesforce-ux/design-system","peerDependencies":{"postcss":"^8.3.5"},"snyk":true,"homepage":"https://lightningdesignsystem.com","lint-staged":{"!(*.local).{js,jsx,json}":["prettier --single-quote --write"],"!(*.local).js":"eslint --cache --fix","*.css":"stylelint --fix"},"lwc":{"modules":[{"name":"@salesforce/slds/legacy","path":"assets/styles/salesforce-lightning-design-system-imports.sanitized.css"}],"expose":["@salesforce/slds/legacy"]},"version":"2.22.2","jest":{"testURL":"http://localhost/","testRegex":"(/__tests__/.*(test|spec))\\.jsx?$","globalSetup":"<rootDir>/jest.setup.global.js","globalTeardown":"<rootDir>/jest.teardown.global.js","setupFilesAfterEnv":["<rootDir>/jest.setup.js"],"moduleNameMapper":{"\\.(scss)$":"<rootDir>/shared/vendor/prism/"},"testPathIgnorePatterns":["<rootDir>/node_modules/","<rootDir>/shared/vendor/prism/","<rootDir>/__crypt/","<rootDir>/.dist/","<rootDir>/.generated/"]},"description":"Salesforce Lightning Design System","bugs":{"url":"https://github.com/salesforce-ux/design-system/issues"},"gitHead":"b7514041ad9878da50287e6f38e3b9adcd654655","_id":"@salesforce-ux/design-system@2.22.2","_nodeVersion":"16.15.0","_npmVersion":"8.13.1","dist":{"integrity":"sha512-Q9JjQcpf/KerzylgSNuXpB7ugz7PXPkcR3HJNjqiISuWTXT562/frLnoUaa2VVMgK/8kuRQw288ACLWVCLIFHA==","shasum":"5f88f45939ab17b7b1272f5414bbfa6133112c9d","tarball":"https://registry.npmjs.org/@salesforce-ux/design-system/-/design-system-2.22.2.tgz","fileCount":6010,"unpackedSize":38884849,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCKPPAgmHbbWZzC7uf4nr64DZ+liXRzFGOzADf9SxVLQAIgZ3lVwjsxv4u15swqu1bPondfF148cI/F+j1oT50Vzb4="}]},"_npmUser":{"name":"salesforce-ux","email":"dse-infra@salesforce.com"},"directories":{},"maintainers":[{"name":"salesforce-ux","email":"dse-infra@salesforce.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/design-system_2.22.2_1699566882830_0.6856012393992235"},"_hasShrinkwrap":false}%

My solution

  1. Download the package tar ball myself and upload it to nexus.
    To get the url to download I did:
    In my case i wanted this version 2.20.1
    so I used:
curl https://registry.npmjs.org/@salesforce-ux/design-system/ \
     | jq '.versions[."dist-tags"."spring-23"].dist.tarball'

if you want the lastest you can use:

curl https://registry.npmjs.org/@salesforce-ux/design-system/ \
     | jq '.versions[."dist-tags".latest].dist.tarball'

So I used browser or curl to get https://registry.npmjs.org/@salesforce-ux/design-system/-/design-system-2.20.1.tgz (you can change the version on this url, it works too.

  1. Get the path url from nexus, for example: “nexus-url.example.com/repository/npm/%40salesforce-ux/design-system/-/design-system-2.20.1.tgz”
  2. Replace @salesforcedx/design-system url in package-lock.json on your project to this new url Example:
"node_modules/@salesforce-ux/design-system": {
      "version": "2.20.1",
      "resolved": "nexus-url.example.com/repository/npm/%40salesforce-ux/design-system/-/design-system-2.20.1.tgz",
      "integrity": "sha512-MZbOfmTOPZD6JOARmW+Co83Ypge5zNAXiu/C2RuVVSa14xS/kqcYuuyPgGPITu7TNMdQ706oQFJRqSj1HH6uZA==",
      "peerDependencies": {
        "postcss": "^8.3.5"
      }
}

IF YOU DON’T have package-lock.json or it isn’t working or need to update it:

  1. Delete package-lock.json from project
  2. Remove the dependency @salesforce-ux/design-system from the project package.json file
  3. Run “npm i --package-lock-only” to create a new clean package-lock.json
  4. In another folder create this package.json
{
  "name": "sample",
  "main": "src/index.js",
  "dependencies": {
    "@salesforce-ux/design-system": "2.20.1"
  }
}
  1. run ‘npm i --registry=http://registry.npmjs.org --package-lock-only’ to generate a package-lock.json with @salesforcedx/design-system info, integrity and dependencies etc.
  2. rename this package-lock.json to package-lock-2.json
  3. copy this package-lock-2.json to the project folder
  4. install ‘npm install -g package-json-merge’ in order to safely merge both package-lock.json
  5. merge both package-lock with command: ‘package-json-merge package-lock.json package-lock-2.json > package-lock-merged.json’
  6. delete both package-lock.json and package-lock-2.json
  7. rename package-lock-merged.json to package-lock.json

FINAL test:
16. test it running ‘npm ci --verbose’

Conclusion:
I opened an issue in @salesforcedx/design-system github project to see if they can fix it:

Maybe I made a wrong interpretation of nexus way of work or maybe there was a easier way to do this, but this was my solution. The thing is, if nexus really uses the general url to get all version, it should maybe change the way it reads this json file? what are your thoughts? At least salesforce could fix the readme’s on this url since it is their side that has the bug still.