在Eclipse中自动格式化JavaScript代码 [英] Auto-formatting of JavaScript code in Eclipse

问题描述

请考虑以下JavaScript代码的格式：

Consider the formatting of this JavaScript code:

$("#dataTable").jqGrid({
    url: base + "products-all",
    datatype: "json",
    jsonReader: {repeatitems: false, id: "ref"},
    colNames:["ID","Product name","Price"],
    colModel:[
        {name:"id",index:"id", width:40, align:"right", classes:"grid-col"},
        {name:"name",index:"name", width:600, align:"left", classes:"grid-col", editable:true, editoptions:{size:25}},
        {name:"price",index:"price", width:100, align:"right", classes:"grid-col", formatter:'currency', formatoptions:{decimalSeparator:".", thousandsSeparator: ",", decimalPlaces: 2, prefix: "$ "}}
    ],
    rowNum:5,
    rowList:[5,10,20],
    height:114,
    shrinkToFit: true,
    sortname: 'id',
    sortorder: "asc",
    pager: "#pagingDiv",
    viewrecords: true,
    caption: "Products"
});

如何在Eclipse中配置JavaScript格式化程序（即首选项> JavaScript > 代码样式> 格式化程序）以确保在应用自动格式设置（ SHIFT + CTRL + F ）后，此代码看起来可以接受吗？我可以使Eclipse将JSON对象的每个字段放在换行符上，但是结果看起来很混乱。我还可以禁用在每个字段之后插入换行符，然后整个对象将在一行中。

How should I configure the JavaScript formatter in Eclipse (i.e., Preferences > JavaScript > Code Style > Formatter) to make sure this code looks acceptable after the auto-formatting (SHIFT + CTRL + F) is applied to it? I can make Eclipse to put each field of the JSON object on a new line, but the outcome will look messy. I also can disable inserting line breakes after each field, then the entire object will be in one line.

是否可以禁止在JSON中插入/删除换行符对象？如果不可能，该如何自动格式化此代码？

Is it possible to disable any insertions/removals of line breaks inside JSON objects? If it's not possible, how should I deal with auto-formatting of this code?

我还有另一个示例：

jQuery("#dataTable").jqGrid(
    'navGrid',
    '#pagingDiv',
    {}, 
    {reloadAfterSubmit:false},
    {reloadAfterSubmit:false},
    {reloadAfterSubmit:false},
    {sopt:['cn','bw','eq','ne','lt','gt','ew']}
);

这是一个方法调用。通常，所有方法参数都应在同一行中。但是在这里，我希望每个参数都换行。如何使此代码通过自动格式设置？

It's a method invocation. Normally, all method arguments should be in the same line. But here I want each argument to be on a new line. How can I make this code to pass auto-formatting?

更新：

我将 Eclipse Kepler用于Java EE开发人员。我认为我的JavaScript编辑器是 JavaScript开发工具插件的一部分，而该插件又是 Eclipse Web Developer Tools 软件包的一部分。

I use Eclipse Kepler for Java EE Developers. I think my JavaScript editor is a part of the JavaScript Development Tools plugin which, in turn, is a part of the Eclipse Web Developer Tools package.

推荐答案

类似的问题在此处用于Eclipse中的Java（非JavaScript）代码格式化程序。最受欢迎的两个答案建议使用 // @formatter：off 标记和从不连接已包装的行选项。不幸的是，Eclipse的默认JavaScript编辑器（我认为它是 JavaScript开发工具 / Eclipse Web开发工具的一部分）都没有提供这些功能。

A similar question has an answer here for Java (not JavaScript) code formatter in Eclipse. The two most popular answers suggest to use the // @formatter:off tag and the Never join already wrapped lines option. Unfortunately, neither of these features is available in Eclipse's default JavaScript editor (which, I think, is a part of JavaScript Development Tools / Eclipse Web Developer Tools).

可能的解决方法是安装 Aptana Studio插件并使用其JavaScript编辑器。该编辑器具有 // @formatter：off 功能（请参见此处了解详情）。我还没有找到类似从不加入已经包装好的行这样的选项。 Aptana Studio是一个具有很多功能的插件，安装它以获取新的JavaScript编辑器可能不切实际。 Aptana Studio允许您编辑JavaScript文件，但是如果您嵌入了任何JavaScript代码（例如JSP文件），则无济于事。

A possible workaround is installing the Aptana Studio plugin and using its JavaScript editor instead. This editor has the // @formatter:off feature (see here for details). I have not found anything like the Never join already wrapped lines option though. Aptana Studio is a plugin with a lot of features, and installing it just to get a new JavaScript editor may not be practical. Aptana Studio allows you to edit JavaScript files, but it will not help if you have any JavaScript code embedded in, say, a JSP file.

另一种可能的解决方法是使用代码选择性格式化：您可以选择一个代码块，然后按 SHIFT + CTRL + F 仅格式化该特定块。

Another possible workaround is using code formatting selectively: you can select a block of code and press SHIFT + CTRL + F to format this particular block only.

如果您正在阅读此文章，则可能是JavaScript代码格式还有另一个问题：启用自动换行时，Eclipse会弄乱JavaScript代码。如最大线宽字段中输入大数字来禁用它。 >这个答案。

If you are reading this post, chances are that you have another problem with JavaScript code formatting: Eclipse messes up JavaScript code when automatic line wrapping is enabled. It can be disabled by putting a big number in the Maximum line width field as explain in this answer.

这篇关于在Eclipse中自动格式化JavaScript代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！