bin

{
  "bin": {
    "gh-pages": "bin/gh-pages.js",
  }
}

包裏面的bin字段相當於在説：“嗨npm，如果待會兒有人執行gh-pages這個命令，就去我目錄下找bin/gh-pages.js這個文件”。

scripts

{
  "dependencies": {
    "gh-pages": "^6.1.1"
  },
  "scripts": {
    "deploy": "gh-pages -d dist"
  }
}

針對上面的package.json內容，當我們執行npm run deploy時，實際執行的目標是什麼？

我們來到gh-pages的目錄結構

然後打開package.json文件，找到bin屬性。

於是我們看到了gh-pages屬性，對應的屬性值就是npm run deploy執行的目標，也就是bin/gh-pages.js這個文件。

main

當該項目是一個npm包時，main指定的文件，將會被作為包的入口。

// craco-less的package.json
{
  "main": "./lib/craco-less.js"
}

// index.js
const CracoLessPlugin = require('craco-less');

上面的require('craco-less')所訪問的就是node_modues/craco-less裏的./lib/craco-less.js文件。

module

前置知識：
CommonJS：使用exports導出的模塊

var add = function(x, y) {
    return a + y;
}

exports.add = add

ESM：使用export導出的模塊

var add = function(x, y) {
    return a + y;
}

export {
  add
};

當打包工具遇到一個npm包，會嘗試識別package.json中的module字段，如果支持，則會優先使用module指向的文件，否則就使用main字段指向的文件。

{
  "main": "./CommonJS.js",
  "module": "./ESM.js"
}

資料：
https://maimai.cn/article/detail?fid=1751256976&efid=BKFBo9Re...