前端工程化-内部 npm 私服搭建

·  阅读 651
前端工程化-内部 npm 私服搭建

前言

在工作中,公司有很多内部的包并不希望发布到npm官网仓库,因为可能涉及到一些私有代码不能暴露。对于前端来讲,这时就可以选择在公司内网搭建npm私有仓库。当前比较主流的几种解决方案:verdaccio、nexus、cnpm。大家可以按照自己的需求选择。本文中采用的是cnpm私服搭建。

cnpm私服搭建流程

1. 安装node,新的node版本会自带npm

官网地址:nodejs.org/zh-cn/

2. 拉取代码,对应公司需求做相应更改

git clone https://github.com/cnpm/cnpmjs.org.git
复制代码

3. 修改配置文件 ./config/index.js

    // 仓库站点访问端口
    registryPort: 7001,   
    // 页面访问端口      
    webPort: 7002,             
    // 外网可以访问的话则注释,否则只能内网访问
    bindingHost: '127.0.0.1',      
    // 数据库配置
    database: {
        db: 'cnpmjs',        // 数据库
        username: 'root',    // 数据库用户名
        password: '',        // 数据库密码
        dialect: 'mysql',    // 数据库类型 'mysql', 'sqlite', 'postgres', 'mariadb'
        host: '',            // 数据库服务地址
        port: 3306           // 端口
    }
    // 用户配置 key 为用户名和密码,value为邮箱
    admins: {  
        harlie: 'yanghui3021@163.com',
        fengmk2: 'fengmk2@gmail.com',
        admin: 'admin@cnpmjs.org',
        dead_horse: 'dead_horse@qq.com',
    },
    ​
    // true为只有管理员可以发布,false是任何人发布都必须带有私有标识
    enablePrivate: false, 
    ​
    //私有标识前缀
    scopes: [ '@harlie','@cnpm', '@cnpmtest' ],
    ​
    //同步模块上游registry地址
    sourceNpmRegistry: 'https://registry.npm.taobao.org',
    ​
    // 同步模式  'none' 不进行同步 , 'all' 定时同步所有源 registry 的模块, 'exist' 只同步已经存在于数据库的模块
    syncModel: 'exist', 
    ​
    // 同步间隔时间
    syncInterval: '10m',
复制代码

4. 数据库创建 (MySQL)

    create database cnpmjs;   // 创建数据库
    use cnpmjs;
    source cnpmjs.org/docs/db.sql;   // 拉取项目的 docs/db.sql
复制代码

5. 命令启动执行 (到这里私有库的搭建已经完成,是不是并不复杂)

    node dispatch.js 
复制代码

启动成功后就可以通过 http://x.x.x.x:7002 查看网址页面。

私有库使用

1. 使用nrm镜像源管理工具添加源

    npm install nrm -g
    nrm add cnpmorg http://42.192.37.59:7001  // 添加源
    nrm use cnpmorg  // 使用cnpmorg源,名字自己定义
    nrm ls
复制代码

2. 内部源使用

    ···NPM···
    npm config set registry http://x.x.x.x:7001

    ···CNPM···
    cnpm config set registry http://x.x.x.x:7001

    ···YARN···
    yarn config set registry http://x.x.x.x:7001
复制代码

3. 本地项目包发布

  • npm login 如下图所示则登陆成功

WX20210701-152517@2x.png

  • npm publish 包发布

WX20210701-152734@2x.png

  • npm view @harlie/cnpm-test

可以看到所发布的包的详情,通过网址页面搜索cnpm-test ,可以在页面查看相应版本信息。

WX20210701-153402@2x.png

结尾

具体代码可在git仓库查看:github.com/HarlieYang/…

公众号:前端技术研究圈

qrcode_for_gh_edf8db621482_258.jpg

分类:
前端
标签: