npm系列:package.json

Posted 赏花赏景赏时光

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了npm系列:package.json相关的知识,希望对你有一定的参考价值。

1、关于packag.json的基础知识

这还是我最熟悉的package.json吗?

2、npm发包流程

npm发包流程 - 知乎

3、sh: vue-cli-service: command not found

mac 报错:sh: vue-cli-service: command not found_充电五分钟...-CSDN博客

一、在开发npm包,或者库的时候,package.json以下属性的配置很重要:

1)files:定义了哪些文件应该被包括在 npm install 后的 node_modules中(有些文件是自动暴露的),避免一些不必要的文件暴露到 node_modules,比如开发一个组件库或者插件的时候,避免使用方多安装依赖

files值可以是文件夹名称,也可以是具体文件名称

  // 可以
  "files": [
    "src"
  ]
   
  // 不可以,前面不能用绝对路径的写法
  "files": [
    "./src"
  ]

注意:如果在发布的包或者库中,没有在package.json中定义files字段,则会暴露源码

2)dependencies、devDependencies

网上大多数文章说dependecies用于生产依赖、devDependencies用于开发环境依赖(通常是工具类的包),但是在做项目的时候,把依赖都安装到devDependencies时候,生产上项目也是可以正常跑起来。这是为什么呢?

因为webpack不管依赖是放在dependencies,还是devDependencies,只要在项目中引用了相关依赖,那么这些依赖就会出现在webpack的Dependency Graph( 依赖图),在构建的时候,都会把依赖打包进构建结果中

个人感觉:这两个属性的作用主要在于开发插件、组件库的时候,发布npm包时候的区分。当发布了一个npm包即A包,第三方在npm install A包时,会将A包中package.json里面的depengdencies依赖都安装,devDependencies不会安装。这样的话可以最大限度避免第三方重复安装依赖。

举个例子:开发了一个基于Vue的插件,那么这个插件要在Vue搭建的项目中才能使用,即第三方的项目里面一定有安装了Vue依赖。为了避免用户在安装插件A的时候又装了一遍Vue,可以在开发A插件的项目的package.json将Vue定义在devDependencies中并结合peerDependencies就可以实现上面的功能了

3)peerDependencies

在开发npm包的时候,提示宿主环境去安装满足插件A中peerDependencies所指定依赖的包,然后在插件import、require所依赖的包的时候,永远都是引用宿主环境统一安装的npm包,最终解决插件与所依赖包不一致的问题,避免依赖重复安装

4)main:指定引用模块的路径

5)name:包名

6)verision:包版本,每次修改内容在发布之前,要修改包版本

7)repository(string,object):代码仓库的地址

二、package.json中字段browser   module     main的优先级

package.json中你还不清楚的browser,module,main 字段优先级 - 浅笑· - 博客园

1、文件优先级:ejs>js

2 、npm包使用环境

1)只允许在客户端使用

2)只允许在服务端使用

3)允许在客户端和服务端使用

三、package.json文件中的字段含义和作用

一些字段的解释package.json里的一些属性讲解 - 知乎

1)description(字符串)、keywords(字符串数组)

这两个字段都是用来在npm官网搜索的, 区别是一个是字符串, 一个是字符串数组。npm会对description做分词搜索, 而对于 keywords会做精准搜索

"description": "Reactive, component-oriented view layer for modern web interfaces.",
"keywords": [
  "vue"
]

2)name(string)、version(string)(option)

在开发npm包的时候一定要写,因为名字版本号是包的唯一标识;name表示包名;version表示包的版本。但是如果是项目的话,可以不写。

"name": "vue",
"version": "2.6.14"

需要注意下面几点

包名注意事项:

A、包名必须少于等于 214 字符,
B、包名不能以 .或_开头
C、包名不能含有大写字母 (历史原因, 有的老包还有大写字母,新的已经不能用大写字母)
D、另外, 一些URL规范里不允许的字符也不能用(具体哪些字符就需要大家自己查查了)
E、建议不要在包名里包含js``node等字眼, 因为npm默认就是js或node的
F、因为包名最终会用在require语句里, 所以尽可能短一些,但要注意能明确表达自己的用途
G、你开发一个包之前, 最好自己上 npm官网看看名字是不是已经被占用了(很重要)

版本号注意事项:对于版本号, npm使用业界标准的 major.feature.patch 模式

major:做了重大改变

feature:增加新功能

patch:修复一些bug

3)homepage(url):这个包的官网 (option)

"homepage": "https://github.com/vuejs/vue#readme"

4)bugs(object):给用户提供上报缺陷的途径。可以是email或者直接给出链接(option)

bugs:  
    "url" : "https://github.com/owner/project/issues",
    "email" : "project@hostname.com"

5)license(string):使我们可以定义适用于 package.json 所描述代码的许可证,有MIT 、 ISC(option)

  "license": "MIT",

6)author(object)、contributors(对象数组)(option)

这是关于作者或者其他开发人员信息的字段。区别是author是单个对象, 而contributors是数组,每一项是一个对象

"author":  
    "name" : "Barney Rubble", 
    "email" : "b@rubble.com", 
    "url" : "http://barnyrubble.tumblr.com/"
,
"contributors": [
   
      "name" : "Barney Rubble", 
      "email" : "b@rubble.com", 
      "url" : "http://barnyrubble.tumblr.com/"
  ,  
      "name" : "Barney Rubble", 
      "email" : "b@rubble.com", 
      "url" : "http://barnyrubble.tumblr.com/"
  
]

7)funding:捐助信息,一般用不到(option)

8)files(array):在发布包的时候,很重要,指明包中应该包含哪些文件,支持目录和通配

  "files": [
    "src",
    "dist/*.js",
    "types/*.d.ts"
  ]

发包时候,一些文件会自动忽略掉

.git
CVS
.svn
.hg
.lock-wscript
.wafpickle-N
.*.swp
.DS_Store
._*
npm-debug.log
.npmrc
node_modules
config.gypi
*.orig
package-lock.json

9)browser:定义npm包在客户端下的入口文件

 // browser 可定义成和 main/module 字段一一对应的映射对象,也可以直接定义为字符串
  "browser": 
    "./lib/index.js": "./lib/index.browser.js", // browser+cjs
    "./lib/index.mjs": "./lib/index.browser.mjs"  // browser+mjs
  ,

  // "browser": "./lib/index.browser.js" // browser

10)module:定义npm包在node端的入口文件

"module": "lib/index.mjs", // module

11)main:定义npm包在客户端和node端的入口文件

"main": "lib/index.js",  // main 

12)bin:定义了一系列可执行命令, 在全局安装的命令行包里尤其多见;带有bin信息的包, 在局部安装后, 可执行文件会在./node_modules/.bin下,;如果是全局安装, 可执行文件会在 $PATH 里对应npm那个目录下.

带有bin信息的包, 在局部安装后, 可执行文件会在./node_modules/.bin下,

如果是全局安装, 可执行文件会在 $PATH 里对应npm那个目录下

"bin": 
    "pm2": "./bin/pm2",
    "pm2-dev": "./bin/pm2-dev",
    "pm2-docker": "./bin/pm2-docker",

13)man(manuel手册):指定一个(或多个)文件, 用于执行man 包名时, 用来指定当前模块的man文档的位置

"man" :[ "./doc/calc.1" ]

14)directories:是一个object, 包含了lib``bin``man``doc``example``test等属性,

主要是用来告诉用户某些功能目录放在哪里

"directories": 
    "bin": "./bin",
    "doc": "./doc",
    "lib": "./lib",
 

15)repository(string,object):代码仓库的地址

 "repository": "git+https://github.com/vuejs/vue.git"



 "repository": 
    "type": "git",
    "url": "git+https://github.com/vuejs/vue.git"
  ,

16)scripts:指定了运行脚本命令的npm命令行缩写

"scripts": 
    "bench:ssr": "npm run build:ssr && node benchmarks/ssr/renderToString.js && node benchmarks/ssr/renderToStream.js",
    "build": "node scripts/build.js",
    "build:ssr": "npm run build -- web-runtime-cjs,web-server-renderer",
    "build:weex": "npm run build -- weex",

17)config(object):添加命令行的环境变量

package.json内容如下:


  "name": "foo",
  "config" :  "port" : "8080" ,
  "scripts" :  "start" : "node server.js" 

server.js脚本就可以引用config字段的中port的值:npm_package_config_xxx,如npm_package_config_port

http
  .createServer(...)
  .listen(process.env.npm_package_config_port)

用户执行npm run start命令时,这个脚本就可以得到值:

npm run start

修改端口号,(但是实际中没有生效,待解决) :

$ npm config set foo:port 80

18)dependencies、devDependencies(object):指定项目的依赖

两者的区分,如上面所述。

对象的各个成员,分别由模块名和对应的版本要求组成,表示依赖的模块及其版本范围,版本范围格式如下:

1、version Must match version exactly
2、>version Must be greater than version
3、>=version etc
4、<version
5、<=version
6、~version "Approximately equivalent to version" See semver
7、^version "Compatible with version" See semver
8、1.2.x 1.2.0, 1.2.1, etc., but not 1.3.0
9、http://... See 'URLs as Dependencies' below
10、* Matches any version
11、"" (just an empty string) Same as *
12、version1 - version2 Same as >=version1 <=version2.
13、range1 || range2 Passes if either range1 or range2 are satisfied.
14、git... See 'Git URLs as Dependencies' below
15、user/repo See 'GitHub URLs' below
16、tag A specific version tagged and published as tag See npm dist-tag
17、path/path/path See Local Paths below




  "dependencies": 
    "foo": "1.0.0 - 2.9999.9999",
    "bar": ">=1.0.2 <2.1.2",
    "baz": ">1.0.2 <=2.3.4",
    "boo": "2.0.1",
    "qux": "<1.0.0 || >=2.3.1 <2.4.5 || >=2.5.2 <3.0.0",
    "asd": "http://asdf.com/asdf.tar.gz",
    "til": "~1.2",
    "elf": "~1.2.3",
    "two": "2.x",
    "thr": "3.3.x",
    "lat": "latest",
    "dyl": "file:../dyl"
  

a)固定版本号,形如:“2.0.1”

b)版本范围,由运算符+固定版本号组成,运算符如下:

< :小于
<=:小于等于
> :大于
>=:大于等于
=:等于. 该符号在实际中可以被忽略掉

形如:
>=1.2.7 <1.3.0:表示版本范围在大于等于1.2.7,小于1.3.0都可以
1.2.7 || >=1.2.9 <2.0.0:可以是1.2.7,1.2.9等,但不能是1.2.8,2.0.0

c)预发布标签alpha

如:>1.2.3-alpha.3中带了预发布标识alpha,那么带预发布标识的版本号需要
[major, minor, patch]一样,即1.2.3-alpha.4,但是1.2.4-alpha.4不满
足条件。没有带预发布标识的版本只要满足大于1.2.3-alpha.3就可以了,比如:1.2.5

d)预发布标识beta

1.2.4-beta.0

e)连字符范围“-”:X.Y.Z - A.B.C

1、1.2.3 - 2.3.4 等价于 >=1.2.3 <=2.3.4
2、如果在第一个范围内少了的部分,则用0替换:
  1.2 - 2.3.4 等价于 >=1.2.0 <=2.3.4
3、如果在第二个范围内少了的部分,则范围都要从这个版本开始:
  1.2.3 - 2.3 等价于 >=1.2.3 <2.4.0-0
  1.2.3 - 2   等价于 >=1.2.3 <3.0.0-0

f)波浪号范围“~”:~1.2.3     ~1.2      ~1

1、~1.2.3 等价于 >=1.2.3 <1.(2+1).0 即:>=1.2.3 <1.3.0-0
2、~1.2 等价于 >=1.2.0 <1.(2+1).0 即:>=1.2.0 <1.3.0-0 (Same as 1.2.x)
3、~1 等价于 >=1.0.0 <(1+1).0.0 := >=1.0.0 <2.0.0-0 (Same as 1.x)
4、~0.2.3 := >=0.2.3 <0.(2+1).0 := >=0.2.3 <0.3.0-0
5、~0.2 := >=0.2.0 <0.(2+1).0 := >=0.2.0 <0.3.0-0 (Same as 0.2.x)
6、~0 := >=0.0.0 <(0+1).0.0 := >=0.0.0 <1.0.0-0 (Same as 0.x)
7、~1.2.3-beta.2 := >=1.2.3-beta.2 <1.3.0-0 Note that prereleases in the 1.2.3 version will be allowed, if they are greater than or equal to beta.2. So, 1.2.3-beta.4 would be allowed, but 1.2.4-beta.2 would not, because it is a prerelease of a different [major, minor, patch] tuple

g)插入符号范围“^“:^1.2.3     ^0.2.5       ^0.0.4

1、^1.2.3 := >=1.2.3 <2.0.0-0
2、^0.2.3 := >=0.2.3 <0.3.0-0
3、^0.0.3 := >=0.0.3 <0.0.4-0
4、^1.2.3-beta.2 := >=1.2.3-beta.2 <2.0.0-0 Note that prereleases in the 1.2.3 version will be allowed, if they are greater than or equal to beta.2. So, 1.2.3-beta.4 would be allowed, but 1.2.4-beta.2 would not, because it is a prerelease of a different [major, minor, patch] tuple.
5、^0.0.3-beta := >=0.0.3-beta <0.0.4-0 Note that prereleases in the 0.0.3 version only will be allowed, if they are greater than or equal to beta. So, 0.0.3-pr.2 would be allowed.

19)peerDependencies同上述

20)peerDependenciesMeta 用户安装您的软件包时,如果peerDependencies尚未安装指定的软件包,npm将发出警告。该 peerDependenciesMeta字段用于向npm提供有关如何使用对等依赖项的更多信息

21)bundledDependencies 这些软件包名称将在发布软件包时捆绑在一起

22)optionalDependencies 如果找不到依赖项或安装失败,则希望npm继续,则可以将其放在 optionalDependencies对象中

23)engines字段指明了该模块运行的平台,比如 Node 的某个版本或者浏览器

 "engines" :  "node" : ">=0.10.3 <0.12"  

24)os 指定操作系统


    "os": [
        "darwin",
        "linux",
        "!win32"
    ]

25、cpu 指定cpu


    "cpu": [
        "x64",
        "ia32",
        "!arm",
        "!mips"
    ]

26、private

这个设置为true, 就会无法npm publish。如果项目需要保密,则需要设置该字段为true,如果需要发包,则不能设置为true

27、publishConfig,定义一个包在发布到npm时的一些配置项

参考文章:

1、https://www.jb51.net/article/254565.htm

以上是关于npm系列:package.json的主要内容,如果未能解决你的问题,请参考以下文章

发布一个npm package

你真的了解package.json吗?

第132篇:npm第一次使用自己的包(package-lock.jsonpackage.json文件作用说明)

有没有办法在不安装包的情况下按字母顺序排列 package.json?

NPM5,package-lock.json 和 package.json 有啥区别?

npm start 作用