vs code 非常好看的vue代码颜色配置教程
在Vs code中使用vue的时候,默认是没有高亮显示的,通常我们都会通过下载插件的方式来解决问题,大部分的童鞋通过下载Vetur插件之后,问题都得到了解决,但也有一少部分人和我一样,下载了Vetur问题仍然存在在我经过网上搜索问题处理方法后,最终得到了问题的解决方法,在此将解决方法分享给大家,供大家参考步骤一:在Vs code中按 Ctrl+Shift+P调出以下界面步骤二:输入setting,
·
在Vs code中使用vue的时候,默认是没有高亮显示的,通常我们都会通过下载插件的方式来解决问题,大部分的童鞋通过下载Vetur插件之后,问题都得到了解决,但也有一少部分人和我一样,下载了Vetur问题仍然存在
在我经过网上搜索问题处理方法后,最终得到了问题的解决方法,在此将解决方法分享给大家,供大家参考
步骤一:在Vs code中按 Ctrl+Shift+P调出以下界面
步骤二:
输入setting,打开Setting.json文件(首选项:打开设置(json))
{
// 强制单引号
"prettier.singleQuote": true,
// 尽可能控制尾随逗号的打印
"prettier.trailingComma": "all",
// 开启 eslint 支持
"prettier.eslintIntegration": true,
// 保存时自动fix
"eslint.autoFixOnSave": true,
// 添加 vue 支持
"eslint.validate": [
"javascript",
"javascriptreact",
{
"language": "vue",
"autoFix": true
}
],
// 使用插件格式化 html
"vetur.format.defaultFormatter.html": "js-beautify-html",
// 格式化插件的配置
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
// 属性强制折行对齐
"wrap_attributes": "force-aligned"
}
},
"vetur.format.defaultFormatter": {
"html": "prettier",
"css": "prettier",
"postcss": "prettier",
"scss": "prettier",
"less": "prettier",
"js": "prettier",
"ts": "prettier",
"stylus": "stylus-supremacy"
},
// html颜色高亮
"files.associations": {
".eslintrc": "json",
"*.vue": "html"
},
"emmet.syntaxProfiles": {
"javascript": "jsx",
"vue": "html",
"vue-html": "html"
}
}
完成后样式
更多推荐
已为社区贡献2条内容
所有评论(0)