npm 阿里源_前端-团队效率(四)私有npm仓库

思考三个问题?

  1. 为什么要使用私有仓库?
  2. 为什么选择verdaccio?怎么搭建verdaccio?怎么使用verdaccio?
  3. 怎么新建Vue组件打包上传到仓库下载使用?(下回吧太长了)

why?私有仓库

  • 安全性,私有服务部署在公司内部,避免不必要的业务代码泄露
  • 效率性,本地内网服务器下载或者阿里云下载速度比外网下载更快?看人品
  • 其他npm仓库的好处(统一管理啥的偷懒了)

how?verdaccio

  • sinopia已经停止更新 https://github.com/verdaccio/verdaccio
  • cnpmjs.org依赖较多,相对笨重 ,操作多https://github.com/cnpm/cnpmjs.org
  • verdaccio持续更新,轻量级,操作少https://github.com/verdaccio/verdaccio

开始安装

检查环境 node -v npm -v 如果没有弄得环境请先安装nodejs

检查防火墙

查看防火墙规则:firewall-cmd --list-all
查询端口是否开放firewall-cmd --query-port=4873/tcp(默认端口,可以自定义)
开放4873端口firewall-cmd --permanent --add-port=4873/tcp (默认端口,可以自定义)
阿里云服务器请开放安全组端口

正式开始安装

npm install -global verdaccio --unsafe-perm(如果单纯-global报错使用当前命令)
#--unsafe-perm  说明:npm会有生命周期,某个包会有生命周期来执行一些东西,安全起见会自动降级导致没有权限执行一些操作,通过--unsafe-perm参数来解锁该限制。

运行 执行 verdaccio

41df527718d6784629ae7d2784985caa.png

记住第一行的配置信息很有用

当前服务是已经启动了,想要整个项目部署团队使用还要一些配置,下面让我们进入配置文件

#
# This is the default config file. It allows all users to do anything,
# so don't use it on production systems.
#
# Look here for more config file examples:
# https://github.com/verdaccio/verdaccio/tree/master/conf
#

# path to a directory with all packages
# 所有包的缓存目录
storage: /Users/fodelf/.local/share/verdaccio/storage
# path to a directory with plugins to include
# 插件目录
plugins: ./plugins  //

# web服务配置
web: 
  title: Verdaccio
  # comment out to disable gravatar support
  # gravatar: false
  # by default packages are ordercer ascendant (asc|desc)
  # sort_packages: asc

#验证服务
auth:
  htpasswd:
    file: ./htpasswd
    # Maximum amount of users allowed to register, defaults to "+inf".
    # You can set this to -1 to disable registration.
    # max_users: 1000

# a list of other known repositories we can talk to
#上游配置本地没有的资源去上游拉取,可以配置淘宝镜像,由于镜像本身问题建议使用源
uplinks:
  npmjs:
    url: https://registry.npmjs.org/

packages:
  '@*/*':
    # scoped packages
    access: $all
    publish: $authenticated
    unpublish: $authenticated
    proxy: npmjs

  '**':
    # allow all users (including non-authenticated users) to read and
    # publish all packages
    #
    # you can specify usernames/groupnames (depending on your auth plugin)
    # and three keywords: "$all", "$anonymous", "$authenticated"
    access: $all

    # allow all known users to publish/publish packages
    # (anyone can register by default, remember?)
    publish: $authenticated
    unpublish: $authenticated

    # if package is not available locally, proxy requests to 'npmjs' registry
    proxy: npmjs

# You can specify HTTP/1.1 server keep alive timeout in seconds for incoming connections.
# A value of 0 makes the http server behave similarly to Node.js versions prior to 8.0.0, which did not have a keep-alive timeout.
# WORKAROUND: Through given configuration you can workaround following issue https://github.com/verdaccio/verdaccio/issues/301. Set to 0 in case 60 is not enough.
server:
  keepAliveTimeout: 60

middlewares:
  audit:
    enabled: true

# log settings
logs:
  - { type: stdout, format: pretty, level: http }
  #- {type: file, path: verdaccio.log, level: info}
#experiments:
#  # support for npm token command
#  token: false

# 监听的端口 ,重点, 不配置这个,只能本机能访问
listen: 0.0.0.0:4873

修改配置文件之后,先 ctr + c 暂停verdaccio 任务 采用下面的方式重新启动

pm2进程守护(开发过node项目的同学知道,node进程跑几天就挂是常有的事情所以需要进程守护)

npm install -g pm2 --unsafe-perm

查找verdaccio可执行js的目录
whereis verdaccio
cd xx 进入目录 
pm2 start verdaccio.js

整个服务端流程结束

启动号服务后,客户端访问地址 http://xxx:4873

330965d2b93da43c1444842db0b40787.png

客户端根据提示在终端执行以下命令

npm set xxx:4873
npm adduser xxx:4873
进入需要发布的插件目录下面
npm login
输入用户名,密码,邮箱
npm publish
发布插件

在客户端访问地址查看 插件是否上传成功

在项目中使用

npm i xx 插件名称

完结撒花!!!!!!!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
npm install vue-beautiful-chat npm WARN ERESOLVE overriding peer dependency npm WARN While resolving: extract-text-webpack-plugin@3.0.2 npm WARN Found: webpack@4.46.0 npm WARN node_modules/webpack npm WARN peer webpack@"^4.0.0" from @intervolga/optimize-cssnano-plugin@1.0.6 npm WARN node_modules/@intervolga/optimize-cssnano-plugin npm WARN @intervolga/optimize-cssnano-plugin@"^1.0.5" from @vue/cli-service@3.12.1 npm WARN node_modules/@vue/cli-service npm WARN 24 more (@soda/friendly-errors-webpack-plugin, ...) npm WARN npm WARN Could not resolve dependency: npm WARN peer webpack@"^3.1.0" from extract-text-webpack-plugin@3.0.2 npm WARN node_modules/extract-text-webpack-plugin npm WARN extract-text-webpack-plugin@"^3.0.1" from vue-photo-preview@1.1.3 npm WARN node_modules/vue-photo-preview npm WARN npm WARN Conflicting peer dependency: webpack@3.12.0 npm WARN node_modules/webpack npm WARN peer webpack@"^3.1.0" from extract-text-webpack-plugin@3.0.2 npm WARN node_modules/extract-text-webpack-plugin npm WARN extract-text-webpack-plugin@"^3.0.1" from vue-photo-preview@1.1.3 npm WARN node_modules/vue-photo-preview npm WARN ERESOLVE overriding peer dependency npm WARN While resolving: uglifyjs-webpack-plugin@0.4.6 npm WARN Found: webpack@4.46.0 npm WARN node_modules/webpack npm WARN peer webpack@"^4.0.0" from @intervolga/optimize-cssnano-plugin@1.0.6 npm WARN node_modules/@intervolga/optimize-cssnano-plugin npm WARN @intervolga/optimize-cssnano-plugin@"^1.0.5" from @vue/cli-service@3.12.1 npm WARN node_modules/@vue/cli-service npm WARN 24 more (@soda/friendly-errors-webpack-plugin, ...) npm WARN npm WARN Could not resolve dependency: npm WARN peer webpack@"^1.9 || ^2 || ^2.1.0-beta || ^2.2.0-rc || ^3.0.0" from uglifyjs-webpack-plugin@0.4.6 npm WARN node_modules/uglifyjs-webpack-plugin npm WARN uglifyjs-webpack-plugin@"^0.4.6" from webpack@3.12.0 npm WARN node_modules/vue-photo-preview/node_modules/webpack npm WARN npm WARN Conflicting peer dependency: webpack@3.12.0 npm WARN node_modules/webpack npm WARN peer webpack@"^1.9 || ^2 || ^2.1.0-beta || ^2.2.0-rc || ^3.0.0" from uglifyjs-webpack-plugin@0.4.6 npm WARN node_modules/uglifyjs-webpack-plugin npm WARN uglifyjs-webpack-plugin@"^0.4.6" from webpack@3.12.0 npm WARN node_modules/vue-photo-preview/node_modules/webpack
06-14

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值