快速开始

1.全局安装npm-x 命令

npm i -g @xsyx/npm-x

2.到小程序项目根目录,找到package.json文件（如果没有的话 npm init 新建一个），在dependencies字段中，写上需要用的组件和版本号（全匹配）,例如

 "dependencies": {
      "@xsyx/header":"1.0.6",
      "@xsyx/component-b": "1.0.1",
      "@xsyx/icons": "1.0.5",
      "@xsyx/nav-bar": "1.0.5"
    },

3.小程序项目根目录，执行 npm-x i ，安装组件，组件全部安装到了 @xsyx-components 目录下，如图, @xsyx-components里面的组件代码不要自己去改动，有需要可以联系组件作者升级版本

npm-x i

4.在页面pages里面引用组件

工具的功能介绍

1.收集组件包和版本依赖,例如

 "dependencies": {
      "@xsyx/header":"1.0.6",
      "@xsyx/component-b": "1.0.1",
      "@xsyx/icons": "1.0.5",
      "@xsyx/nav-bar": "1.0.5"
    },

收集到依赖关系

| 组件 | 依赖组件 | 依赖组件 | 依赖组件 | 依赖组件 | | ------ | ------ | ------ | ------ | ------ | | header 1.0.6 | nav-bar 1.0.6 | icons 1.0.4 | component-a 1.0.3 || | component-b 1.0.1 | nav-bar 1.0.5 | icons 1.0.4 | component-a 1.0.3 || | icons 1.0.5 | component-a 1.0.3 | ||| | nav-bar 1.0.5 | icons 1.0.4 | component-a 1.0.3 ||| | component-a 1.0.3 | header 1.0.4 | nav-bar 1.0.5 | icons 1.0.4 | component-a 1.0.3 |

2.去重，组件包只安装一份

只要安装这些包

component-a 1.0.3，header 1.0.6 ，header 1.0.4 ，nav-bar 1.0.6，nav-bar 1.0.5，icons 1.0.5 ，icons 1.0.4

3.解决多版本问题，遵循以下原则

（1）package.json中依赖的组件版本，直接放到@xsyx-components下，这是第一原则。

例如nav-bar 1.0.6，nav-bar 1.0.5 ，同时安装，1.0.5 会安装在第一层

（2）不同版本的相同组件，会被安装在被依赖的组件下面，如图 icons 1.0.4被安装在多层目录，因为第一层目录根据原则（1）安装了 icons 1.0.5，

（3）分析组件名称和版本，减少目录层级，（windows下面有目录的层数限制），尽量将组件安装到@xsyx-components下

例如component-a