vscode怎么格式化js中的json数据?

JavaScript019

vscode怎么格式化js中的json数据?,第1张

1、vs code安装插件eslint2、文件 - 首选项 - 设置 - json配置3、粘贴以下JSON配置，保存{// vscode默认启用了根据文件类型自动设置tabsize的选项"editor.detectIndentation": false,// 重新设定tabsize"editor.tabSize": 2,// #每次保存的时候自动格式化"editor.formatOnSave": true,// #每次保存的时候将代码按eslint格式进行修复"eslint.autoFixOnSave": true,// 添加 vue 支持"eslint.validate": ["javascript","javascriptreact",{"language": "vue","autoFix": true}],// #让prettier使用eslint的代码格式进行校验"prettier.eslintIntegration": true,// #去掉代码结尾的分号"prettier.semi": false,// #使用带引号替代双引号"prettier.singleQuote": true,// #让函数(名)和后面的括号之间加个空格"javascript.format.insertSpaceBeforeFunctionParenthesis": true,// #这个按用户自身习惯选择"vetur.format.defaultFormatter.html": "js-beautify-html",// #让vue中的js按编辑器自带的ts格式进行格式化"vetur.format.defaultFormatter.js": "vscode-typescript","vetur.format.defaultFormatterOptions": {"js-beautify-html": {"wrap_attributes": "aligned-multiple"},"prettyhtml": {"printWidth": 100,"singleQuote": false,"wrapAttributes": false,"sortAttributes": false}},// 格式化stylus, 需安装Manta's Stylus Supremacy插件"stylusSupremacy.insertColons": false, // 是否插入冒号"stylusSupremacy.insertSemicolons": false, // 是否插入分好"stylusSupremacy.insertBraces": false, // 是否插入大括号"stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行"stylusSupremacy.insertNewLineAroundBlocks": false,"window.zoomLevel": 0,"[javascript]": {"editor.defaultFormatter": "vscode.typescript-language-features"}}

工作中经常用到JSON数据，用Sublime Text格式化JSON以便查看数据。格式化JSON需要安装Pretty Json插件。以mac为例，windows的只是部分按键不同。步骤如下： 步骤一：安装插件管理工具Package Control（以命令安装方式为例，其他方式可直接参考 官方地址 ） 打开命令选项板，mac下的快捷键：command+shift+p，输入以下命令： 回车后稍等几秒，安装完成自动弹出以下界面： 步骤二：安装Pretty Json插件 在以上界面输入Pretty Json，回车等待安装完成。 步骤三：测试JSON格式化 选中JSON数据，按command+shift+p打开命令选项版，输入pretty，找到Pretty Json: Format JSON，按回车后数据就格式化好了。 附加：进行完步骤三其实就能格式化了，但是总是输入命令不太方便，我们可以设置格式化快捷键：以 control+command+j 为例。 打开Sublime Text，依次点击左上角菜单Sublime Text->Preferences->Key Bindings，出现以下文件： 左边的是Sublime Text默认的快捷键，不可编辑。右边是我们自定义快捷键的地方，在中括号中加入以下数据并保存： 按照步骤三的数据测试快捷键，能成功格式化JSON数据。 (文章有帮到您烦请点个赞吧~）