vue3保存属性自动换行问题及解决
作者：码农的1024
这篇文章主要介绍了vue3保存属性自动换行问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
背景：
通过vue-cli创建的项目（vue3/ts/eslint），设置了eslint保存自动修正，当template内容过长时属性就会自动换行，很烦人！
网上看了很多方法，大多是配置vetur，但是这个不支持vue3 ts,所以放弃了这个办法，最后通过安装prettier解决了问题。
因为每个人使用vscode的习惯不同，项目配置也不同，所以导致出现换行的问题可能会很多，希望能帮助到看到文章的你。
1、安装prettier依赖
yarn add prettier -D
新建 .prettierrc.js 文件
module.exports = {
printWidth: 400, // 这里设置大一些，内容多时也不会换行
tabWidth: 2, // 空格2
semi: false, // 结尾是否使用分号
singleQuote: true, // 使用单引号
disableLanguage: ['vue'],
htmlWhitespaceSensitivity: 'ignore',
trailingComma: 'none' // 函数末尾是否添加逗号，注意这里经常会跟eslint冲突
}
2、新建 .prettierignore 文件
/dist/* .local .output.js /node_modules/** **/*.svg **/*.sh /public/*
3、设置vscode格式化配置
总结
大功告成！！！
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。