@bornkiller
2018-01-03T10:49:44.000000Z
字数 3457
阅读 2578
前端实践
开发迭代项目逐步壮大,项目间共享代码就变得尤为重要。常用的框架/类库完全没必要在每个种子项目内管理,企业内部产出的公共模块也需要有合理的共享机制,避免重复开发投入。曾经使用 bower 来管理下载内部公共模块,但稳定性,易用性都有所缺失。时过境迁,使用 NPM 管理前端代码已经是业界趋势。企业内部使用 NPM 私服,方便公司内部共享公共模块,提升内网包安装速度。本文记录一下搭建过程,帮助大家规避可能的问题。
cnpmjs.org - 阿里开源的企业级 NPM 解决方案MariadbNginx基本流程参照官方wiki,https://github.com/cnpm/cnpmjs.org/wiki/Deploy 即可完成,不再赘述,下文只谈及搭建过程中遇到的坑与解决方案。
官方源同步过程中,如果描述信息包含 emoji 等特殊字符,会导致无法入库,造成同步失败。开发环境下,无法通过私服安装成功,例如 styled-components 。解决方案非常明确,修改 Mariadb 字符集配置,创建库表时,显式声明字符集。
修改配置文件:
[client]default-character-set = utf8mb4[mysql]default-character-set = utf8mb4[mysqld]character-set-client-handshake = FALSEcharacter-set-server = utf8mb4collation-server = utf8mb4_unicode_ci
创建数据库:
# 显式声明库字符集create database cnpmjs CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;# 显式声明表字符集CREATE TABLE IF NOT EXISTS `user` (.......) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='user base info';
cnpmjs.org 提供初始化 SQL 脚本 docs/db.sql,需要多处调整编码声明,详细内容参照 https://gist.github.com/bornkiller/739b60a5eef8d52f52e70b7228297a12。
数据库配置完毕,然后需要调整 cnpmjs.org 数据库连接编码,关键部分如下:
{dialect: 'mariadb',dialectOptions: {charset: 'utf8mb4',collate: 'utf8mb4_unicode_ci'}}
到此为止,特殊字符能够正常入库,同步得以正常进行。
私服重启过程中,可能遇到数据库无法连接的状况,此处完全使用简单方案,通过套接字路径连接,关键部分如下:
{dialect: 'mariadb',dialectOptions: {socketPath: '/var/lib/mysql/mysql.sock' // 指定套接字文件路径}}
默认配置下,私服仅可本机访问,无法对外提供服务。当然可以通过调整 cnpmjs.org 配置来实现,最好使用 Nginx 反向代理,方便后续做发布权限管理,推荐配置如下:
server{listen 80;server_name *.*.*;location /{proxy_redirect off;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header REMOTE-HOST $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_connect_timeout 60;proxy_send_timeout 60;proxy_read_timeout 60;proxy_pass http://127.0.0.1:7001;}}
系统防火墙会拦截掉部分网络请求,导致无法对外提供服务,只需要调整防火墙规则即可:
firewall-cmd --get-active-zones;firewall-cmd --zone=public --add-port=80/tcp --permanent;firewall-cmd --reload;
私服搭建完毕,需要配置安装源到私服,执行如下命令:
# 修改NPM配置npm config set registry "http://registry.location.com";
如果使用 yarn,执行相同操作:
yarn config set registry "http://registry.location.com";
安装 package 过程中,可能会下载第三方资源,由于国内网络不稳定,需要使用国内镜像提升下载速度,部分支持环境变量,部分支持 .npmrc 配置内容。
修改 .npmrc 配置内容如下:
# 使用npmnpm config set disturl "https://npm.taobao.org/dist";npm config set phantomjs_cdnurl "http://npm.taobao.org/mirrors/phantomjs";npm config set chromedriver_cdnurl "http://npm.taobao.org/mirrors/chromedriver";npm config set operadriver_cdnurl "http://npm.taobao.org/mirrors/operadriver";
# 使用yarnyarn config set disturl "https://npm.taobao.org/dist";yarn config set phantomjs_cdnurl "http://npm.taobao.org/mirrors/phantomjs";yarn config set chromedriver_cdnurl "http://npm.taobao.org/mirrors/chromedriver";yarn config set operadriver_cdnurl "http://npm.taobao.org/mirrors/operadriver";
配置环境变量如下:
# ~/.bash_profileexport ELECTRON_MIRROR=http://npm.taobao.org/mirrors/electron/;export SQLITE3_BINARY_SITE=http://npm.taobao.org/mirrors/sqlite3;export SASS_BINARY_SITE=http://npm.taobao.org/mirrors/node-sass;export PYTHON_MIRROR=http://npm.taobao.org/mirrors/python;export PUPPETEER_DOWNLOAD_HOST=https://storage.googleapis.com.cnpmjs.org;
至此,NPM 私服配置完毕,安装过程耗时基本可以接受。
cnpmjs.org 自身权限管控非常薄弱,因此当前发布权限全部回收,仅限管理员能够发布。发布前,详细检查 package.json,README.md 等文件,保障新老开发都能够轻松使用。
为与官方源做出区别,内部发布全部采用 scope package 方式,默认启用 @universal/***,发布企业级公共模块。部分项目规模较大,可以考虑采纳分割为多个子模块的方式,以项目名作为 scope name,方便持续迭代。
私服基本搭建完毕,时间匆忙,当前存在以下问题:
break change 发布无法通知到依赖模块及其维护人员,导致多版本混乱;code review,持续集成,发布环节比较割裂;上述问题,将在后续迭代中进行处理。
本文记录搭建私服的所遇所闻,用以帮助大家规避可能遇到问题。搭建私服只是企业内部代码共享的第一步,所谓路漫漫其修远兮,优化整体结构,推动开发丰富完善私服库,将是长远的任务,谨与大家共勉。