【vue、react】前端如何为package.json添加注释

前言

写了个项目，想给package.json 加注释结果发现加不上去，就在网上查找了相关文章，特意总结记录一下，防止下次使用。

参考文章：如何为package.json添加注释

众所周知，JSON文件是不支持注释的，除了JSON5/JSONC之外，我们在开发项目特别是前端项目时，大量会用到JSON文件，特别是在编写package.json中的scripts时，由于缺少注释,当有大量的命令脚本时，就有了添加注释的需求。

因此就有了JsonComments这个Vscode扩展插件，可以为工程中的任意Json文件增加注释功能。启用JsonComments插件的效果如下：

在这里插入图片描述

安装

打开VSCode扩展，搜索JsonComments，然后安装即可。

使用方法

请添加图片描述

• 添加注释 打开当前工作区任意JSON文件，在任意键上悬停，在悬停提示中点击Add Comment，即可输入并添加注释。 添加的注释将以CodeLens的形式显示在所注释的键上方。
• 删除注释 直接点击注释内容，选择删除注释即可。
• 清空注释 按下Ctrl+Shift+P，输入Clear All Comments，即可清空当前文档的所有注释。

问题

• 注释内容保存在哪里？ 默认情况下，注释内容保存在当前工作区的package.json文件中的json-comments中。 如果你想要修改保存位置，可以工作区配置中进行修改。
• 如何更改注释保存位置? 修改工作区配置JsonComments中的Save File和Entry Key即可。 例如：

// 保存在当前工作区的comments.json文件中
"json-comments": {
    "Save File": "comments.json",
    "Entry Key": ""                
}

• 注释会修改原始的JSON文件吗？ 不会，所有的注释默认均保存在package.json文件中的中。
• 注释提交到到Git后会丢失吗？ 不会，只要你将保存注释的文件一起提交即可。
• 开发团队中其他人可以看到注释吗？ 可以，只需要安装JsonComments插件即可。
• 当JSON文件编辑后注释内容会丢失吗？ 只要所注释的键的jsonpath路径没有变化就不会丢失。JsonComments是以jsonpath路径为键来保存注释内容的。
• 当移动JSON文件时会导致注释丢失吗？ 当前版本会导致注释失效，但是注释内容还保存package.json（默认）中，您可以通过手动修改对应的jsonpath来恢复。下一版本将通过侦听文件移动来自动完成此工作。