zoukankan      html  css  js  c++  java
  • package.json和npm install、cnpm install 的問題

    問題最近使用cnpm安装项目依赖后,运行项目出现样式错乱问题。

    描述最近项目开发,需求参插了很多个版本,所以在前端项目的主干上拉好几套分支代码。拉的分支并不会把node_modules也拉过去,所以只能重新安装cnpm install。运行项目发现一个很严重的bug,一些样式没有生效,导致一些功能没办法正常使用。然后就开始找问题,发现主干上(还是原来的node_modules)的代码运行是没有问题,那么应该是cnpm install的安装的node_modules依赖出现问题了,然后我又用npm install安装了一遍,运行后样式还是错乱的。

    我将分支上的node_modules和主干上的node_modules进行对比,发现版本不一样!!!

     

    但是,我又对比了主干和分支的package.json ,发现里面的版本信息都是一样的 "vue-loader": "^13.0.4", 按道理node_modules也一样才对呀???为什么呢?

    解决过程那么我们现在来研究两个问题

    1、package.json 版本信息

    2、cnpm install和npm install 的安装区别

    -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- 

    一、package.json 版本信息

    1、版本的格式

    major.minor.patch

    主版本号.次版本号.修补版本号

    ————————————————————

    patch:修复bug,兼容老版本

    minor:新增功能,兼容老版本

    major:新的架构调整,不兼容老版本

    补丁中的更改表示不会破坏任何内容的错误修复。 次要版本的更改表示不会破坏任何内容的新功能。 主要版本的更改代表了一个破坏兼容性的大变化

    2、版本指定

    • version

      必须匹配某个版本

      如:1.1.2,表示必须依赖1.1.2版

    • ^version

      兼容某个版本

      版本号中最左边的非0数字的右侧可以任意

      如果缺少某个版本号,则这个版本号的位置可以任意

      如:^1.1.2 ,表示>=1.1.2 <2.0.0,可以是1.1.2,1.1.3,.....,1.1.n,1.2.n,.....,1.n.n

      如:^0.2.3 ,表示>=0.2.3 <0.3.0,可以是0.2.3,0.2.4,.....,0.2.n

      如:^0.0,表示 >=0.0.0 <0.1.0,可以是0.0.0,0.0.1,.....,0.0.n

    • ~version

      大概匹配某个版本

      如果minor版本号指定了,那么minor版本号不变,而patch版本号任意

      如果minor和patch版本号未指定,那么minor和patch版本号任意

      如:~1.1.2,表示>=1.1.2 <1.2.0,可以是1.1.2,1.1.3,1.1.4,.....,1.1.n 

      如:~1.1,表示>=1.1.0 <1.2.0,可以是同上

      如:~1,表示>=1.0.0 <2.0.0,可以是1.0.0,1.0.1,1.0.2,.....,1.0.n,1.1.n,1.2.n,.....,1.n.n

    • >version

      必须大于某个版本

      如:>1.1.2,表示必须大于1.1.2版

      >=version

      可大于或等于某个版本

      如:>=1.1.2,表示可以等于1.1.2,也可以大于1.1.2版本

      <version

      必须小于某个版本 

      如:<1.1.2,表示必须小于1.1.2版本 

      <=version

      可以小于或等于某个版本

      如:<=1.1.2,表示可以等于1.1.2,也可以小于1.1.2版本

    • x-range

      x的位置表示任意版本

      如:1.2.x,表示可以1.2.0,1.2.1,.....,1.2.n

    • *-range

      任意版本,""也表示任意版本

      如:*,表示>=0.0.0的任意版本

    • version1 - version2

      大于等于version1,小于等于version2

      如:1.1.2 - 1.3.1,表示包括1.1.2和1.3.1以及他们件的任意版本

    • range1 || range2

      满足range1或者满足range2,可以多个范围

      如:<1.0.0 || >=2.3.1 <2.4.5 || >=2.5.2 <3.0.0,表示满足这3个范围的版本都可以

    • latest 当前发布版本。
      这是一个标记(tag,详见 dist-tag |npm Documentation),默认情况下 npm install 安装的就是这个 latest 标记。 常见的标记还有 next stable beta canary

    感谢 @钱天兵 https://www.cnblogs.com/wshiqtb/p/6395029.html

    ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    因为 package.json中的"vue-loader": "^13.0.4",所以安装的是 >=13.0.4 <14.0.0,所以安装了13.7.2这个版本。

    那么我只能用最笨的办法,就是对照package.json 里面的依赖,对照主干上的node_modules上的版本,去更新package.json 例如"vue-loader": "^13.0.4"  ===》"vue-loader": "13.0.4"  指定安装某个版本。然后 npm install ,再次运行,发现样式错乱的问题解决了。

    发现生成了一个package-lock.json 文件。下一篇文章,再研究一下package-lock.json 和package.json 的区别。现在研究一下cnpm和npm 的区别先。

    ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

    二、cnpm install和npm install 的安装区别

    • cnpm:优点是速度快,缺点是没办法保证每个同事安装依赖的时候版本一致,就会出现依赖升级不兼容性问题
    • npm:优点是通过package-lock.json文件能够锁定版本,缺点是安装速度慢。

    cnpm install 安装的包会在 node_modules 里创建两个文件夹,其中一个是另一个的引用,这样就会导致项目依赖比较多的时候 node_moduels 里有很多引用目录。

    而 npm install 则不是这样 

  • 相关阅读:
    pymongo 学习
    Mongodb 学习
    2个list取交集
    2个list取差集
    yaml 基础
    is 和 ==的区别
    软件测试人员需要掌握的linux命令(二)
    免费翻译API破解(简易翻译工具)
    测试面试解析
    Python之Time模块
  • 原文地址:https://www.cnblogs.com/qiu-Ann/p/10773238.html
Copyright © 2011-2022 走看看