我如何使用更漂亮的配置改进代码格式

Question

我正在使用 prettier 和 vs code 选项 "editor.formatOnSave": true

这是我的 .prettierrc 配置：

module.exports = {
    semi: false,
    overrides: [
        {
            files: ['*.js', '*.json', '*.css'],
            options: {
                trailingComma: 'es5',
                tabWidth: 4,
                semi: true,
                singleQuote: true,
            },
        },
        {
            files: ['*.html'],
            options: {},
        },
    ],
};

有更好的方法吗？以及我应该在 HTML 选项中输入什么以获得更清晰的 HTML 代码而不需要像这样的东西：

<tr
                    ng-repeat="student in displayVars.studentsToShow track by student.id"
                >

我的 HTML 文件应该像那样在一行中，我不确定发生了什么

<tr ng-repeat="student in displayVars.studentsToShow track by student.id">

顺便说一下，我正在使用 angulars 1 这是一个需要维护的旧项目。

Answer 1

我们应该将 printWidth 选项添加到 1000

module.exports = {
    semi: false,
    overrides: [
        {
            files: ['*.js', '*.json', '*.css'],
            options: {
                trailingComma: 'es5',
                tabWidth: 4,
                semi: true,
                singleQuote: true,
            },
        },

        {
            files: ['*.html'],
            options: {
                printWidth: 1000,
                tabWidth: 4,
                htmlWhitespaceSensitivity: 'ignore',
                proseWrap: 'never',
            },
        },
    ],
};

我如何使用更漂亮的配置改进代码格式

How can i improve code formatting using prettier configuration

html

javascript

formatting

visual-studio-code

prettier