package.json 非官方字段集合

denson 發(fā)布于2019-08-23 11:56 / 2890人閱讀

摘要：非官方字段集合官方字段請參考。下面介紹的是非官方字段，也就是各種工具定義的相關(guān)字段。詳細(xì)參考相關(guān)字段設(shè)置項(xiàng)目的瀏覽器兼容情況。相關(guān)字段測試庫。相關(guān)字段代碼檢查與優(yōu)化。

package.json 非官方字段集合

package.json 官方字段請參考 https://docs.npmjs.com/files/package.json。下面介紹的是非官方字段，也就是各種工具定義的相關(guān)字段。

1. yarn 相關(guān)字段

yarn: 類似 npm 的依賴管理工具，但 yarn 緩存了每個(gè)下載過的包，所以再次使用時(shí)無需重復(fù)下載，同時(shí)利用并行下載以最大化資源利用率，因此安裝速度更快。

flat

{
  "flat": true
}

如果你的包只允許給定依賴的一個(gè)版本，你想強(qiáng)制和命令行上 yarn install --flat 相同的行為，把這個(gè)值設(shè)為 true。

詳細(xì)參考 yarn - flat.

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"
  }
}

允許你覆蓋特定嵌套依賴項(xiàng)的版本。有關(guān)完整規(guī)范，請參見選擇性版本解析 RFC。

詳細(xì)參考 yarn - resolutions.

2. unpkg 相關(guān)字段

unpkg: 讓 npm 上所有的文件都開啟 cdn 服務(wù)。

unpkg

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

正常情況下，訪問 jquery 的發(fā)布文件通過 https://unpkg.com/jquery@3.3.1/dist/jquery.js，當(dāng)你使用省略的 url https://unpkg.com/jquery 時(shí)，便會按照如下的方式獲取文件：

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

# 定義了 unpkg 屬性時(shí)
https://unpkg.com/jquery@[latestVersion]/[pkg.unpkg]

# 未定義 unpkg 屬性時(shí)，將回退到 main 屬性
https://unpkg.com/jquery@[latestVersion]/[pkg.main]

詳細(xì)參考 https://unpkg.com.

3. TypeScript 相關(guān)字段

TypeScript: JavaScript 的超集

types, typings

{
  "main": "./lib/main.js",
  "types": "./lib/main.d.ts"
}

就像 main 字段一樣，定義一個(gè)針對 TypeScript 的入口文件。

詳細(xì)參考 TypeScript documentation.

4. browserslist 相關(guān)字段

browserslist: 設(shè)置項(xiàng)目的瀏覽器兼容情況。

browserslist

{
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ]
}

支持的工具：

Autoprefixer

Babel

postcss-preset-env

eslint-plugin-compat

stylelint-no-unsupported-browser-features

postcss-normalize

詳細(xì)參考 browserslist.

5. 發(fā)行打包相關(guān)字段

點(diǎn)擊 Setting up multi-platform npm packages 查看相關(guān)介紹。

module

{
  "main": "./lib/main.js",
  "module": "./lib/main.m.js"
}

就像 main 字段一樣，定義一個(gè)針對 es6 模塊及語法的入口文件。

構(gòu)建工具在構(gòu)建項(xiàng)目的時(shí)候，如果發(fā)現(xiàn)了這個(gè)字段，會首先使用這個(gè)字段指向的文件，如果未定義，則回退到 main 字段指向的文件。

支持的工具：

rollup

webpack

詳細(xì)參考 rollup - pkg.module.

browser

{
  "main": "./lib/main.js",
  "browser": "./lib/main.b.js"
}

指定該模塊供瀏覽器使用的入口文件。

如果這個(gè)字段未定義，則回退到 main 字段指向的文件。

支持的工具：

rollup

webpack

browserify

詳細(xì)參考 babel-plugin-module-resolver.

esnext

{
  "main": "main.js",
  "esnext": "main-esnext.js"
}

# or

{
  "main": "main.js",
  "esnext": {
    "main": "main-esnext.js",
    "browser": "browser-specific-main-esnext.js"
  }
}

使用 es 模塊化規(guī)范，stage 4 特性的源代碼。

詳細(xì)參考 Transpiling dependencies with Babel, Delivering untranspiled source code via npm.

es2015

{
  "main": "main.js",
  "es2015": "main-es2015.js"
}

Angular 定義的未轉(zhuǎn)碼的 es6 源碼。

詳細(xì)參考 https://docs.google.com/document/d/1CZC2rcpxffTDfRDs6p1cfbmKNLA6x5O-NtkJglDaBVs/edit#.

esm

詳細(xì)參考 adjusted proposal: ES module "esm": true package.json flag.

6. react-native 相關(guān)字段

react-native: 使用 react 組件技術(shù)寫原生APP。

react-native

{
  "main": "./lib/main.js",
  "react-native": "./lib/main.react-native.js"
}

指定該模塊供 react-native 使用的入口文件。

如果這個(gè)字段未定義，則回退到 main 字段指向的文件。

源代碼查看.

7. webpack 相關(guān)字段 sideEffects

{
  "sideEffects": true|false
}

聲明該模塊是否包含 sideEffects（副作用），從而可以為 tree-shaking 提供更大的優(yōu)化空間。

詳細(xì)參考 sideEffects example, proposal for marking functions as pure, eslint-plugin-tree-shaking.

8. microbundle 相關(guān)字段

microbundle: 基于 rollup 零配置快速打包工具。

source

{
  "source"： "src/index.js"
}

源文件入口文件。

詳細(xì)參考 Specifying builds in package.json.

umd:main

{
  "umd:main"： "dist/main.umd.js"
}

umd 模式 bundle 文件。

詳細(xì)參考 Specifying builds in package.json.

8. parcel 相關(guān)字段

parcel: 零配置打包工具。

source

查看 parcel-bundler/parcel#1652.

9. babel 相關(guān)字段

babel: es6 -> es5 轉(zhuǎn)碼器。

babel

配置 babel。

10. eslint 相關(guān)字段

eslint: js 代碼檢查與優(yōu)化。

eslintConfig

配置 eslint。

11. jest 相關(guān)字段

jest: js 測試庫。

jest

{
  "jest": {
    "verbose": true
  }
}

配置 jest。

詳細(xì)參考 jest docs.

12. stylelint 相關(guān)字段

stylelint: style 代碼檢查與優(yōu)化。

stylelint

配置 stylelint。

詳細(xì)參考 New configuration loader.

13. ava 相關(guān)字段

ava: js 測試庫。

ava

{
  "ava": {
    "require": [ "@std/esm" ]
  }
}

配置 ava。

詳細(xì)參考 ava configuration.

14. nyc 相關(guān)字段

nyc: istanbul.js 命令行。

nyc

{
  "nyc": {
    "extension": [".js", ".mjs"],
    "require": ["@std/esm"]
  }
}

配置 nyc。

詳細(xì)參考 nyc docs.

15. CommonJS 保留字段

保留字段: build, default, email, external, files, imports, maintainer, paths, platform, require, summary, test, using, downloads, uid.

不可用字段: id, type, 以 _ 和 $ 開頭的字段。

16. Standard JS 相關(guān)字段

Standard JS: js 代碼檢查與優(yōu)化。

standard

{
  "standard": {
    "parser": "babel-eslint",
    "ignore": [
      "**/out/",
      "/lib/select2/",
      "/lib/ckeditor/",
      "tmp.js"
    ]
  }
}

配置 standard.

詳細(xì)參考 https://standardjs.com/.

17. 其他 style

聲明當(dāng)前模塊包含 style 部分，并指定入口文件。

支持的工具：

parcelify

npm-less

rework-npm

npm-css

詳細(xì)參考 Package.json "style" Attribute, istf-spec.

less

與 style 一樣，但是是 less 文件。

支持的工具：

npm-less

18. 更多

參考 package.json fields explained.

19. 后續(xù)

更多博客，查看 https://github.com/senntyou/blogs

作者：深予之 (@senntyou)

版權(quán)聲明：自由轉(zhuǎn)載-非商用-非衍生-保持署名（創(chuàng)意共享3.0許可證）

GPU云服務(wù)器云服務(wù)器 package.json 排序字段日期字段日志字段

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/97703.html

發(fā)表評論

登陸后可評論

0條評論

denson

男|高級講師

我要關(guān)注我要私信

TA的文章

pacificrack黑五優(yōu)惠：混合服務(wù)器3折，低至$30/月，E5-2650v2/16G/240G

閱讀 2623·2021-11-22 12:05
學(xué)stm32有機(jī)會進(jìn)大公司嗎？如何選擇？

閱讀 3505·2021-10-14 09:42
舍利云：日本vps電信聯(lián)通CN2移動(dòng)直連2核2G內(nèi)存5M帶寬28.8元起

閱讀 1738·2021-07-28 00:15
自適應(yīng)和響應(yīng)式

閱讀 2039·2019-08-30 11:08
【學(xué)習(xí)筆記】CSS深入理解之float

閱讀 1544·2019-08-29 17:31
snippet,讓你編碼效率翻倍

閱讀 974·2019-08-29 16:42
JS 1-數(shù)據(jù)類型

閱讀 2392·2019-08-26 11:55
javascript 數(shù)組的常用方法

閱讀 2164·2019-08-26 11:49

亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

上云采購季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺、長期優(yōu)惠，快來選購！

package.json 非官方字段集合

相關(guān)文章

前端進(jìn)階（13） - 搭建自己的前端腳手架

Nodejs開發(fā)簡單的腳手架工具

2018 年了，你還是只會 npm install 嗎

package.json文件各字段的說明

Express 實(shí)戰(zhàn)（八）：利用 MongoDB 進(jìn)行數(shù)據(jù)持久化

發(fā)表評論

0條評論

denson

男|高級講師

TA的文章

pacificrack黑五優(yōu)惠：混合服務(wù)器3折，低至$30/月，E5-2650v2/16G/240G

學(xué)stm32有機(jī)會進(jìn)大公司嗎？如何選擇？

舍利云：日本vps電信聯(lián)通CN2移動(dòng)直連2核2G內(nèi)存5M帶寬28.8元起

自適應(yīng)和響應(yīng)式

【學(xué)習(xí)筆記】CSS深入理解之float

snippet,讓你編碼效率翻倍

JS 1-數(shù)據(jù)類型

javascript 數(shù)組的常用方法

最新活動(dòng)

資訊專欄INFORMATION COLUMN

上云采購季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺、長期優(yōu)惠，快來選購！

package.json 非官方字段集合

相關(guān)文章

發(fā)表評論

0條評論

男|高級講師

TA的文章

最新活動(dòng)

上云采購季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺、長期優(yōu)惠，快來選購！