Prettier的printWidth设置后,为什么长字符串还是自动换行?

Newb.慧利 阅读 28

在React组件里写了一个长字符串变量,按照文档把.eslintrc里的printWidth设成120了,但保存时长字符串还是被强制换行了…

代码像这样:


const description = '这个说明文字特别长需要保持单行显示这个说明文字特别长需要保持单行显示这个说明文字特别长需要保持单行显示';

结果保存后变成


const description = '这个说明文字特别长需要保持单行显示这个说明文字特别长需要保持单行显示
这个说明文字特别长需要保持单行显示';

试过直接在代码里加// prettier-ignore注释倒是能解决,但想知道为什么printWidth设置失效?是不是和其他配置冲突了?

我来解答 赞 6 收藏
二维码
手机扫码查看
1 条解答
宇文素香
你这个情况我遇到过,printWidth没生效是因为Prettier默认对字符串字面量有单独处理逻辑。调试看看就知道了,Prettier有个叫proseWrap的配置,默认是preserve,它会强制拆分长文本字符串。

重点是printWidth只控制代码行宽,但对字符串内容本身不是绝对生效。特别是中文这种没有空格分隔的文本,Prettier分析词边界时容易直接按字符数硬切。

解决方案有两个:

第一种是改Prettier配置,在.prettierrc里加
{
"proseWrap": "never"
}

这样就能禁止文本换行了。

第二种是保持现有配置,把字符串改成模板字符串,用括号包起来
const description = (这个说明文字特别长需要保持单行显示这个说明文字特别长需要保持单行显示这个说明文字特别长需要保持单行显示);

这样Prettier会当作表达式处理,就不会拆分了。

推荐用第一种,一劳永逸。另外确认下你是不是.eslintrc里混着写Prettier配置?那玩意儿不生效的,得单独放.prettierrc文件里。
点赞 4
2026-02-09 05:04