Skip to content

npm private registry ​

This is a private npm registry for the first company I worked for. It's a modern private npm registry built with Verdaccio, UNPKG, VitePress.

NOTE

In order to prevent leakage, the relevant data display screenshots have been processed or partially used as sample data

More details cannot be shown here due to the company's privacy policy.

Technologies ​

  • Vue
  • React
  • TypeScript
  • Vite
  • Express

Features ​

  • As a private npm registry
  • UNPKG proxy
  • Basic authorization
  • Audit log
  • Issue management

Example ​

Login ​

It contains a basic authorization system.

registry-login

Center ​

It's a registry center page, you can see all the packages and their versions.

Extend the Verdaccio and UNPKG, showing the examples/*.html as the package's demo page.

Avoiding every package need to build the document framework to display.

shell
.
│  CHANGELOG.md
│  index.d.ts
│  package.json
│  README.md
│  structure.gliffy
│  vite.config.mjs
├─cypress
│      changeSelect.cy.js
│      dictTranslation.cy.js
│      dnd.cy.js
│      filterable.cy.js
│      ...
├─examples
│      assistantTable.html
│      cacheSelectedCk.html
│      customTableHead.html
│      dictTranslation.html
│      disabledButton.html
│      dnd.html
│      expandableRow.html
│      expression.html
│      filterable.html
│      fixedColumns.html
│      foldTable.html
│      hideMoreButtons.html
│      index.html
│      lineEditor.html
│      lineHeight.html
│      linkStyleButton.html
│      local.html
│      mergeCell.html
│      mergeThead.html
│      operationColumns.html
│      renderFunction.html
│      responsive.html
│      rowStyle.html
│      sum.html
│      treeTable.html
│      virtualScroll.html
│      watermark.html
└─src
    └─...

registry-cover

Embed UNPKG ​

If we view the source code of the package, we can see the unpkg is embedded in the page.

registry-UNPKG

Audit Log ​

The audit log is a list of all the packages and their versions.

registry-changelog

Issue Management ​

The issue management is a list of all the issues and their status. Binding npm packages with the issue number like GitHub.

registry-issues

Tech Sharing Platform ​

Also, I built a tech sharing platform for the company; it's a simple and modern tech sharing platform built with VitePress.

This platform is used for internal technology accumulation and technical personnel sharing and sedimentation within the company.

tech-sharing

Why no more? ​

More details cannot be shown here due to the company's privacy policy.

Last updated: