package.json 配置详解

NovaAstra
2,197 阅读4分钟
  • name 项目名称
  • version 项目版本号
  • dependencies 项目依赖包
  • scripts npm命令
  • homepage 设置应用的跟路径

    项目打包后是要运行在一个域名之下的，有时候可能是运行在跟域名下，也有可能运行在某个子域名下或或域名的某个目录下，这时候我们就需要让我们的应用知道去哪里加载资源，这时候就需要我们设置一个跟路径，而且有时候我们的资源会部署在 CDN 上，你必须告诉打包工具你的CDN地址是什么。比如我们用 create-react-app 开发的 React 应用，以及 Vue CLI 开发的项目，默认是继承了 webpack 的，当不配置 homepage 属性，build 打包之后的文件资源应用路径默认是 /

如下图

image.png

当你设置了 homepage 属性后，比如我这里homepage 设置为 github 的 pages 服务地址

image.png

包后的资源路径就会加上 homepage 的地址。比如上面图片配置好 homepage 之后我打包一个 React 项目，打包后 index.html 页面的资源路径就是：

image.png

  • bugs 提供给使用者上报 **bugs**的途径, 可以填一个**email**或者一个**issue地址**
    {
        "url" : "https://github.com/owner/project/issues",
        "email" : "project@hostname.com"
    }

如果你只想提供一个issue地址, 那么bugs可以只是一个字符串

  • repository 放置你的git地址, 格式如下
    "repository" :{ 
        "type" : "git", 
        "url" : "https://github.com/npm/npm.git"
    }
  • engines 声明你的包需要在怎样的node环境下运行 (npm也一样可以声明)
    "engines" : { 
        "node" : ">=0.10.3 <0.12" 
    }

只有在用户配置 npm 的engine-strict后, 才会有意义, 不然只会冒出一个 warning (程序员看不到 warning)

  • engineStrict 忽略, 最新的 npm已经废弃这个了

  • description 描述，npm会对description做分词搜索

  • keywords 关键字，npm会对description做精准搜索

  • author 作者

  • private

如果你设置"private": true，npm就不会发布它。这是一个防止意外发布私有库的方式。如果你要确定给定的包是只发布在特定registry（如内部registry）的，用publishConfighash的描述来重写registry的publish-time配置参数。

  • license

你应该要指定一个许可证，让人知道使用的权利和限制的。最简单的方法是，假如你用一个像BSD或者MIT这样通用的许可证，就只需要指定一个许可证的名字，像这样：

    { "license" : "BSD" }

如果你又更复杂的许可条件，或者想要提供给更多地细节，可以这样:

    "licenses" : [
      { "type" : "MyLicense"
      , "url" : "http://github.com/owner/project/path/to/license"
      }
    ]
  • main

这个是一个重要属性,原文对这个描述比较绕, 实际上可以理解为 入口文件

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

以上面的例子来说, 如果你的包名是foo, 当用户代码require('foo')时,相当于require了你包目录下的 ./src/index.js文件.如果没有提供这个字段, 默认是项目根目录下的index.js

  • types or typings 类型声明入口文件

  • unpkg 让 npm 上所有的文件都开启 cdn 服务

    {
      "unpkg": "dist/jquery.js"
    }

正常情况下，访问 jquery 的发布文件通过 https://unpkg.com/jquery@3.3.1/dist/jquery.js，当你使用省略的 url https://unpkg.com/jquery 时，便会按照如下的方式获取文件：

    # [latestVersion] 指最新版本号，pkg 指 package.json

    # 定义了 unpkg 属性时
    https://unpkg.com/jquery@[latestVersion]/[pkg.unpkg]

    # 未定义 unpkg 属性时，将回退到 main 属性
    https://unpkg.com/jquery@[latestVersion]/[pkg.main]
  • resolutions 
    {
      "resolutions": {
        "transitive-package-1": "0.0.29",
        "transitive-package-2": "file:./local-forks/transitive-package-2",
        "dependencies-package-1/transitive-package-3": "^2.1.1"
      }
    }

允许你覆盖特定嵌套依赖项的版本

  • files

这个不是必选项, 也并不常见, 但是很重要, 因为有配置这个信息会显得非常专业.files是一个数组, 它描述了你 npm publish的时候推送到npm服务器的文件列表,支持目录和通配 比如

    "files": [
        "LICENSE",
        "History.md",
        "Readme.md",
        "index.js",
        "lib/"
      ],

反过来, 你可以通过一个 .npmignore 文件来排除一些文件, 防止大量的垃圾文件推送到npm, 规则上和你用的gitignore是一样的.

反过来, 你可以通过一个 .npmignore 文件来排除一些文件, 防止大量的垃圾文件推送到npm, 规则上和你用的gitignore是一样的.

package.json 配置学习 - 知乎 (zhihu.com)

package.json里的一些属性讲解 - 知乎 (zhihu.com)

【小技巧】package.json中homepage属性的作用_前端全栈开发者-CSDN博客

package.json 字段说明 - 孟繁贵 - 博客园 (cnblogs.com)

package.json字段详解 - SegmentFault 思否

package.json 非官方字段集合 - SegmentFault 思否

avatar
文章
阅读
粉丝