1. vue文件相关配置
安装插件vetur 与 prettier
{
"vetur.format.defaultFormatter.html": "prettyhtml",
"vetur.format.defaultFormatter.css": "prettier",
"vetur.format.defaultFormatter.js": "prettier",
"vetur.format.defaultFormatter.less": "prettier",
"vetur.format.defaultFormatter.scss": "prettier",
"vetur.format.defaultFormatter.postcss": "prettier",
"vetur.format.defaultFormatter.ts": "prettier",
"vetur.format.options.tabSize": 4,
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
"wrap_attributes": "force-expand-multiline"
},
"prettyhtml": {
"printWidth": 100,
"singleQuote": true,
"wrapAttributes": false,
"sortAttributes": false
},
"prettier": {
"semi": false
}
}
}
2.jsx语法配置
{
"files.associations": {
".js": "javascriptreact"
},
}
3.prettier格式化相关配置
1)保存自动格式化
{
"editor.formatOnSave": true
}
2) 格式化内容配置(每项具体含义参考其官网)
{
"prettier.singleQuote": true,
"prettier.printWidth": 120,
"prettier.semi": false,
"prettier.bracketSpacing": true,
"prettier.proseWrap": "preserve",
"prettier.tabWidth": 4,
"prettier.jsxBracketSameLine": false
}
此配置内容针对css,less,scss,js,html,ts,jsx文件,vetur里的配置内容针对vue文件