VS Code环境配置Vue篇

在VS Code中，配置适合Vue的开发环境；
安装prettier插件, 并且在settings.json中,做出如下配置

settings.json配置

// 编辑器设置
"editor.tabSize": 2,
"editor.fontLigatures": true,
"editor.formatOnSave": true,
"editor.renderWhitespace": "none",
"editor.renderControlCharacters": false,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"diffEditor.ignoreTrimWhitespace": false,
"terminal.integrated.rendererType": "dom",
"window.zoomLevel": 0,
"minapp-vscode.disableAutoConfig": true,

// 代码格式化设置
"prettier.semi": false,
"prettier.singleQuote": true,
"prettier.trailingComma": "all",
"prettier.arrowParens": "avoid",
"prettier.endOfLine": "auto",
// 配置js的文档格式化工具
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[vue]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"vetur.format.defaultFormatterOptions": {
// vetur新版本不会读取prettier的配置, 需要在这里设置
"prettier": {
"singleQuote": true,
"semi": false,
"trailingComma": "all"
}
},
"emmet.includeLanguages": {
"wxml": "html"
},
"javascript.implicitProjectConfig.experimentalDecorators": true,
"css.fileExtensions": ["css", "scss", "vue"],
"files.associations": {
"*.cjson": "jsonc",
"*.wxss": "css",
"*.wxs": "javascript"
},

.prettierrc配置

{
 "eslintIntegration": true,
 "singleQuote": true,
 "semi": false,
 "trailingComma": "all"
}