大家好,我是小v,是一个几个月的新手前端,近期在拉项目的时候出现了这个问题了基本每页代码都出现了黄色的波浪线,当初我想起了之前在学习的时候,记得我学到“ctrl+s自动格式化”,因此我上网搜了下让我复制这段代码在设置里的setting里面。
{
// vscode默认启用了根据文件类型自动设置tabsize的选项
"editor.detectIndentation": false,
// 重新设定tabsize
"editor.tabSize": 2,
// #每次保存的时候自动格式化
"editor.formatOnSave": true,
// #每次保存的时候将代码按eslint格式进行修复
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"editor.formatOnPaste": true,
"editor.formatOnType": true,
"eslint.codeAction.showDocumentation": {
"enable": true
},
// 添加 vue 支持
"eslint.validate": [
"javascript",
"javascriptreact",
"html",
"vue"
],
// #让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": "force-aligned"
// #vue组件中html代码格式化样式
}
},
// 格式化stylus, 需安装Manta's Stylus Supremacy插件
"stylusSupremacy.insertColons": false, // 是否插入冒号
"stylusSupremacy.insertSemicolons": false, // 是否插入分好
"stylusSupremacy.insertBraces": false, // 是否插入大括号
"stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
"stylusSupremacy.insertNewLineAroundBlocks": false,
"html.format.enable": false // 两个选择器中是否换行
}
但问题是,它并不生效。。。网上很多方法也不生效。什么版本啊,prettier我也没安装。后面看了下,原来是format on save没关,这个会与自动格式化冲突。因此在设置搜索format,把这个勾选取消就可以了,记得关闭vscode重新启动项目哦。
最后,介绍下,我是小v,一个刚进前端的新手,入职半年,分享我在工作中遇到的问题~也顺便记录我的成长