프런트 엔드 엔지니어링 : npm 패키지 관리 이해 및 패키지를 npm에 게시

1. npm패키지 버전 번호 에 대한 인식

• 1. 단순 npm패키지 버전의 의미

  "moment": "^2.22.1"
  

• 2. 버전 번호 설명

  • major.minor.patch[-当前版本属于]
  • major: 파괴적으로 변경된 버전 (유사한 angular1-->angular2변경)
  • minor: 기능적 반복 버전
  • patch: 단순 수정 bug버전
  • 네 번째로 가장 흔한 것은
    • Alpha: 베타 버전
    • Beta: 공개 베타
    • RC: 공식 버전이 출시되기 전 미리보기 버전

• 3. 패키지를 잠그는 여러 가지 방법

  • ^처음에는 첫 번째 버전을 변경할 수 없습니다.
  • ~처음에는 두 번째 버전을 변경할 수 없습니다.
  • >=어떤 버전이보다 큼

프로젝트에서 사용할 수있는 두 가지 종속성 메서드

• 1. 프로젝트 의존성 dependencies[공통]
• 2. 개발 의존성 devDependencies[공통]
• 3, 동일한 의존성 peerDependencies[같은 bootstrap의존성 jquery]
• 4. 선택적 종속성 optionalDependencies[예 : minireset.css]
• 5. 패키지 종속성bundleDependencies

셋, 툴킷 작성의 기본 단계

• 1. 프로젝트 초기화 (프로젝트 이름에는 중국어 특수 문자를 사용할 수 없습니다.)

  npm init --yes
  

• 2. 프로젝트 아래 bin에 코드 를 저장할 폴더를 만듭니다.

  #! /usr/bin/env node
  // 需要在shell窗口中能执行的文件,必须先申明使用申明环境的
  

• 3. package.json명령 구성

  "bin": {
        
        
    "mp": "./bin/mp.js"
  }
  

• 4. 컴퓨터의 npm글로벌 패키지에 대한 바로 가기 만들기

  npm link
  

• 5. 창에서 명령을 실행 한 link결과

• 6. 임시 로컬 패키징 명령

  npm pack
  

• 7. 프로젝트를 설치해야하는 곳에 직접 설치

  npm install 目录/包名
  

넷째, 패키지 출시 npm전 준비

• 1. package.json파일 구성

  {
        
        
    "name": "", // 包名
    "version": "", // 版本号
    "description": "", // 简单的描素,告诉npm这个是做什么的
    "main": "lib/index.js", // 入口文件
    "scripts": {
        
         // 需要执行的脚本
      "build": "tsc"
    },
    "keywords": [ // 关键词,方便别人搜索到你的包
      
    ],
    "homepage": "", // 用于指定该模块的主页
    "repository": {
        
         // 用于指定模块的代码仓库
      "type": "git",
      "url": "https://github.com/xxx"
    },
    "author": "", // 作者邮箱,方便别人发邮件到你邮箱
    "license": "MIT", // 开源许可号
    "files": [ // 需要发布到npm上的文件夹,或者使用.npmignore类似.gitignore来忽视不需要发布的文件
      "dist",
      "lib",
      "es"
    ]
  }
  

• 2. 같은 이름의 패키지가 있는지 확인

  • npmjs공식 웹 사이트로 이동하여 검색하세요.

• 3. 버전 번호 릴리스를 수정하는 올바른 방법

package.json파일의 버전을 수동으로 직접 수정하지 마세요 . 수동으로 수정하면 만들 수 없습니다 tag. 다음 명령을 사용하여 자동으로 수정 된 버전을 수정하고 새로 만듭니다 tag. git웨어 하우스에 제출할 때 현재의 스냅 샷.tag

• npm version patch : 업그레이드 개정 번호
• npm version minor : 부 버전 번호 업그레이드
• npm version major : 주 버전 번호 업그레이드

다섯,에 패키지를 게시npm

• 1. nrm현재 미러 소스가 npmjs공식 인지 확인하는 데 사용

  nrm ls
  # or
  nrm current
  
  # 切换镜像源的方式
  nrm use 名称
  

• 2. 로그인 및 해제

  npm addUser
  npm publish
  # 删除远程仓库的一个包,删除后24小时候才可以发同名的包
  npm unpublish --force
  

6. 보충 설명, 이제 점점 더 많은 패키지가 ts코드 를 지원해야합니다 . 게시 할 때이를 사용 ts하여 쓸 수 있습니다.

• 1. 초기 프로젝트는 위와 동일합니다.

• 2. 명령 생성tsconfig.json

  tsc --init 
  

• 3. tsconfig.json폴더의 내용

  {
        
        
    "compilerOptions": {
        
        
      /* Basic Options */
      "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */
      "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
      "lib": ["es6"],                             /* 编译需要的库文件，例如你指定的 target 是 ES5，但是在代码中使用了 ES6 特性，就需要在 lib 中加上 ES6 */
      "declaration": true,                   /* 是否生成文件的声明文件 */
      "outDir": "./lib",                        /* 输出目录 */
      "strict": true,                           /* Enable all strict type-checking options. */
    },
    "include": ["./src/**/*"],
    "exclude": ["node_modules", "**/__tests__/*"]
  }
  

• 4. 파일에서 package.json변환 명령 x.d.ts을 구성하면 변환 후 파일 이 자동으로 생성됩니다.

  "scripts": {
        
        
    "build": "tsc",
  },