小项目中管理npm包版本的思路与方法

背景

笔者在最近碰到一个问题:

有一些项目没有类似jenkins的自动部署平台,前端部署都是本地执行npm run build命令生成压缩包,然后放到服务器上面,解压到nginx 目录, 但是有的时候遇到一个问题,比如项目中某个成员升级了其他组写的一个组件packageA,但是其他成员可能没有升级,导致上线后就会有一些问题,一个包还好,如果有好几个包都没有升级,那么可能导致一些意想不到的问题。

思路

首先就这个问题,我思考后有以下几个问题

  • package.json中的包名的版本有几个是用的^x.x.x的形式,不利于判断
  • 如何对比包的版本

解决

问题1

针对第一个问题解决方案就是 直接用x.x.x的方式,一个包的更新必定是至少有一个人知道这个事情才会去更新包,所以包名是可以不带任何标识的

问题2

针对第二个问题

node_modules中的版本是低的,但是package.json的版本是最新的,所以我们可以自定一个脚本判断两个版本是否一致

const path = require('path');
const projectRoot = process.cwd();
const projectPack = require(path.resolve(projectRoot, 'package.json'));
// 需要对比的包名
const modules = ['element-ui'];
const allDependencies = {
  ...(projectPack.dependencies || {}),
  ...(projectPack.devDependencies || {}),
};

modules.forEach(module => {
  try {
    const packVersion = allDependencies[module];
    // 有一些包名是有文件夹的比如@vue/cli-service,是在@vue文件夹下
    const realPath = packVersion.aplit('/');
    const pack = require(path.resolve(
      ...[projectRoot, 'node_modules', ...realPath, 'package.json'],
    ));
    const needVersions = packVersion.match(/d+/g);
    const realVersions = pack.version.match(/d+/g);
    for (const i in needVersions) {
      if (
        isDef(needVersions[i]) &&
        isDef(realVersions[i]) &&
        parseInt(realVersions[i]) < parseInt(needVersions[i])
      ) {
        exit(module);
      }
    }
  } catch (error) {
    exit(module);
  }
});

function exit(moduleName) {
  throw new Error(`${moduleName} 版本过低,请执行 npm i/npm install`);
}
function isDef(num) {
  return num !== null && num !== undefined;
}

package.json改造 增加check 脚本

 "scripts": {
    "check": "node build/checkNpmPackageVersion.js",
    "dev": "npm run check && vue-cli-service serve",
    "build": "npm run check && vue-cli-service build",
    "lint": "vue-cli-service lint"
  },

不足

  • 如果包名不是纯数字的话对比有问题,因为我们公司的包名都不带alpha,beta等,所以我没有考虑
  • 有一些可以考虑和远程仓库对比,比如调npm info包名命令将结果对比

总结

到此这篇关于小项目中管理npm包版本的思路与方法的文章就介绍到这了,更多相关小项目管理npm包版本内容请搜索179885.Com以前的文章或继续浏览下面的相关文章希望大家以后多多支持179885.Com!

猜你在找的小项目中管理npm包版本的思路与方法相关文章

EfficientNet模型具有很独特的特点,这个特点是参考其它优秀神经网络设计出来的,本文以Efficientnet-B0和Efficientdet-D0为例,进行Efficientdet的解析,感兴趣的朋友一
网络编程有三个要素,分别是IP地址、端口号和通信协议,那本文主要讲述的是TCP与UDP这两种通信协议,以及编程的实现,感兴趣的可以了解一下
我们打包APP需要用到HBuilder,所以本文主要介绍了HBuilder下载安装以及如何使用,最后介绍如何打包app,感兴趣的可以了解一下
nGrinder是NHN公司用Java语言开发的一款的基于Grinder开发的开源B/S Web性能测试平台,具有友好简洁的用户界面和分布式测试功能,本文给大家分享nGrinder性能工具源
很多朋友不清楚IDEA/WebStorm/Pycharm鼠标滚轮ctrl+滚轮-调节缩放字体大小的,下面我以idea开发工具为例给大家通过截图一步步展示操作方法,需求的大佬可以参考下
很多朋友问小编浏览器输入http被自动跳转至https问题,到底该怎么解决呢,其实解决方法很简单,主要关闭浏览器的HSTS功能就可以了,关于http自动跳转至https的解决方法跟
把ELF格式是如何组织一个符号,以及动态链接器如何读取并处理这些信息以进行符号查询的全过程详细地讲清楚,本文的实现以及so文件均以glibc 2.31为准,对ELF格式的.gnu
最近需要打开文件后缀名为.xmind的文件,所以下载了Xmind8 。打开以后想要导出,奈何普通版本只能导出.txt文本文档,所以就总结出了这篇文章,对Xmind8 Pro破解方法感兴
分享一个适用最新Sublime Text4 Build 4107注册码(密钥)及Sublime Text 4完美永久破解方法,需求的大佬可以参考下
说到position,稍微对css了解的能马上说出四个属性值:static 、relative、absolute、fixed。更深一步去讨论,牵扯出诸如上文提到的normal flow、containing block、bf
今天要讲的window.getComputedStyle ,就像刚接触JS的时候,看到 document.getElementById一样,名字都这么长,顿生怯意。不过莫慌,我觉得如果我们不是只想做一个混饭吃的
本文主要讲述一下CSS伪元素before和after的各种妙用,对此感兴趣的同学,可以参考下。