运行yarn add后如何在package.json文件中保留注释

Question

我正在使用npm和yarn来管理项目的依赖项。正如这个问题中所建议的：How do I add comments to package.json for npm install?我使用以下格式以便能够在 pacakge.json 中包含注释。这是一个示例：

"scripts": {
  "////":"LIVE BROWSER RELOAD",
  "serve:patternlab": "BUILD_TO='patternlab' browser-sync start --config browsersync.config.js",
  "serve:site": "browser-sync start --config browsersync.config.js",

  "////":"LINTING COMMANDS",
  "lint:js": "eslint $npm_package_config_src_js --ignore-pattern **/vendor/**/*.js || true",
  "lint:css": "sass-lint $npm_package_config_src_css**/*.scss -v -q || true",
  "lint": "npm-run-all -p lint:js lint:css",
}

这种格式可以很容易地看到每组脚本正在做什么。但是，每当我运行

yarn add

添加新包时，它都会删除除最后一个注释之外的所有注释（移到

scripts

对象的顶部），并删除换行符。我可以做些什么来避免这种情况发生吗？

Answer 1

这是我最接近我想要实现的目标。运行

yarn add

后将保留以下内容，并为每组脚本添加一些分隔：

"scripts": {
    "//LIVE BROWSER RELOAD": "--------------------------------------------------------------------------",
    "serve:patternlab": "BUILD_TO='patternlab' browser-sync start --config browsersync.config.js",
    "serve:site": "browser-sync start --config browsersync.config.js"
    ,
    "//LINTING COMMANDS": "-----------------------------------------------------------------------------",
    "lint:js": "eslint $npm_package_config_src_js --ignore-pattern **/vendor/**/*.js || true",
    "lint:css": "sass-lint $npm_package_config_src_css/**/*.scss -v -q || true",
    "lint": "npm-run-all -p lint:js lint:css"
}

Answer 2

有方法支持

JSON

评论：

1. 使用

   JSON5

   。
2. 在 VSCODE 中将文件类型指定为

   JSON with comment

   ，这是一种 vscode 特定格式，称为 jsonc。你有没有注意到

   tsconfig.json

   也支持评论？
3. 我推荐使用Vscode插件

   JsonComments

   。这是一个方便的插件，允许您向任何 JSON 文件添加注释。