配置更漂亮以更合理的方式破坏JSON数据

Question

是否可以通过某种方式告诉（讽刺地称为）漂亮，我只希望JSON对象的最后一个元素长于最大长度时就断开。

export const list = [
    { title: 'Title 1', id: 'abc', component: () => <div>Something TODO</div> },
    { title: 'Title 2', id: 'def', component: () => <div>Hello Hello !! TODO</div> },
    { title: 'Title 3', id: 'ghi', component: () => <div>Blah Blah Blah Blah Blah TODO asdf asdf asdf asdf asdf asdf</div> },
    { title: 'Title 4', id: 'jkl', component: () => <div>Something Else</div> },
    { title: 'Title 5', id: 'mno', component: () => <div>abc def ghi</div> },
    { title: 'Title 6', id: 'pqr', component: () => <div>lalalallalalala la la </div> },
];

我的第三个元素太长，所以我想像这样打破它：

export const list = [
    { title: 'Title 1', id: 'abc', component: () => <div>Something TODO</div> },
    { title: 'Title 2', id: 'def', component: () => <div>Hello Hello !! TODO</div> },
    { title: 'Title 3', id: 'ghi', 
        component: () => <div>Blah Blah Blah Blah Blah TODO asdf asdf asdf asdf asdf asdf</div> },
    { title: 'Title 4', id: 'jkl', component: () => <div>Something Else</div> },
    { title: 'Title 5', id: 'mno', component: () => <div>abc def ghi</div> },
    { title: 'Title 6', id: 'pqr', component: () => <div>lalalallalalala la la </div> },
];

更漂亮的东西给了我这个垃圾：

export const list = [
    { title: 'Title 1', id: 'abc', component: () => <div>Something TODO</div> },
    { title: 'Title 2', id: 'def', component: () => <div>Hello Hello !! TODO</div> },
    {
        title: 'Title 3',
        id: 'ghi',
        component: () => <div>Blah Blah Blah Blah Blah TODO asdf asdf asdf asdf asdf asdf</div>,
    },
    { title: 'Title 4', id: 'jkl', component: () => <div>Something Else</div> },
    { title: 'Title 5', id: 'mno', component: () => <div>abc def ghi</div> },
    { title: 'Title 6', id: 'pqr', component: () => <div>lalalallalalala la la </div> },
];

是否可以配置漂亮的文件，以便以更易读的方式格式化代码？