I'm wondering what Prettier rule or rules is or are causing this code:
To be formatted as such:
The "problem" in ESLint (I'm using eslint-plugin-prettier and eslint-config-prettier, although disabling ESLint and only using Prettier produces the same result) is displayed as such:
Replace `(<a·key='draft'·href={'/draft/'·+·results['id']}>Draft</a>))` with `⏎················<a·key="draft"·href={'/draft/'·+·results['id']}>⏎··················Draft⏎················</a>,⏎··············);`eslintprettier/prettier
Which led me to believe that possibly this was being cause by printWidth, but I've currently set that to 600 to experiment, and this line has been unaffected—other lines have so I've ruled out that printWidth is not being respected. Here is my .prettierrc.json:
{
"bracketSpacing": false,
"jsxBracketSameLine": true,
"singleQuote": true,
"trailingComma": "all",
"printWidth": 600
}
It seems like some of Prettier's more arcane rules are being applied here, and maybe I'm seeing the confluence of a couple of things. Maybe there's some preference for JSX that's also an argument to a function?
Related
I have a simple if/else construct with both having single statements within. if case correctly does not default to automatic {}, while else (unfortunately, in my view) does.
Also, unless the user manually formats the code selection, (either by Ctrl-K Ctrl F, or else Ctrl-Shift-i), correct formatting does not happen. See gif below.
My formatting settings in settings.json currently are:
"C_Cpp.clang_format_fallbackStyle": "{BasedOnStyle: Google, IndentWidth: 4, ColumnLimit: 0}",
"editor.formatOnType": true
Is there a way to:
(1) by default set the else NOT to provide a {/* code */} block.
(2) have the else align vertically with the if without having to manually force formatting of the selection.
I have a large code base with indentation that is very inconsistent.
I finally got some buy in from developers for running a code formatter.
I would like to start with just fixing the indentation because indentation is a lighter touch than running clang-format with a style.
I like correcting indentation only because when you do the indentation only and then run git diff --ignore-space-at-eol --ignore-space-change --ignore-all-space you get zero diff lines.
I want to avoid a situation where the formatted code is somehow worse and so people avoid any future attempts at making our codebase better via something like clang-format. In our case at least we can agree on spaces-only, tabs are 4-spaces. So improving only the indentation can only be a good thing.
Eclipse has a feature to "correct indentation" (via Menu --> Source --> Correct Indentation):
Correct Indentation
Applies simple indentation rules to the current selection, or the line containing the cursor, if there is no selection
Ctrl+I
Eclipse's "Correct Indentation" does just the indentation but it is not a shell command and i want/need a shell command so that I can run the command on all the source code files.
Is there a way to use clang-format to do "indentation only"? if yes, how?
For example with space-only, 4-spaces.
Clang-format always works with a default format. You can just customize it. If you don't specify a style the clang-format default is chosen. [1],[2]
Unfortunately, you cannot necessarily fix only indentation.
In the comments to your question KamilCuk suggested to use indent probably referring to https://www.gnu.org/software/indent/
I thought about configuring a custom style which does only indentation but, while going over the style options there are unfortunately some which might alter the code-base, depending on how it looks, like AllowShortIfStatementsOnASingleLine
This disallows the co-existence of
if (a)
return ;
else {
return;
}
if (b) return ;
else {
return;
}
So, it might be possible that you find a certain configuration which works for your code-base, but this would be highly specific and brittle.
[1]
The configuration file can consist of several sections each having different Language: parameter denoting the programming language this section of the configuration is targeted at. See the description of the Language option below for the list of supported languages. The first section may have no language set, it will set the default style options for all lanugages. Configuration sections for specific language will override options set in the default section.
https://clang.llvm.org/docs/ClangFormatStyleOptions.html#configuring-style-with-clang-format
[2]
This section lists the supported style options. Value type is specified for each option. For enumeration types possible values are specified both as a C++ enumeration member (with a prefix, e.g. LS_Auto), and as a value usable in the configuration (without a prefix: Auto).
BasedOnStyle (string)
The style used for all options not specifically set in the configuration.
https://clang.llvm.org/docs/ClangFormatStyleOptions.html#configurable-format-style-options
I don't have a Shell script for you that can do this on all source files, however, I use VSCode that allows me to specify the clang format fallback style in the settings.json so that every time I save my files, it applys the same formatting to each one consistently. Here is an example of my settings.json C_Cpp.clang_format_fallbackStyle that applys an indent width of 4.
"C_Cpp.clang_format_fallbackStyle": " {BasedOnStyle: Google, AllowShortCaseLabelsOnASingleLine: true, AlignConsecutiveDeclarations: true, AllowShortFunctionsOnASingleLine: All, AlignTrailingComments: true, Language: Cpp, AlwaysBreakAfterReturnType: None, PenaltyReturnTypeOnItsOwnLine: 9999, PointerAlignment: Left, SortIncludes: true, IndentWidth: 4, ColumnLimit: 0, BreakBeforeBraces: Allman, SpacesBeforeTrailingComments: 5, AlignAfterOpenBracket: true, AlignConsecutiveAssignments: true, AlignConsecutiveMacros : true}",
https://clang.llvm.org/docs/ClangFormatStyleOptions.html This documentation will explain the different parameters and values for this option. For your questions specifically, I would look at "IndentWidth" and "UseTab".
Is there a way to disable the printWidth rule warning in prettier?
I want to be able to determine my own line length for readability. In certain cases I want a line break, and in other cases I don't.
I tried this in my .prettierrc file :
{
"singleQuote": true,
"printWidth" : "off"
}
But this does not work.
The short answer is no, you cannot disable it entirely.
There are, however, a few workarounds, but they have caveats.
To quote an answer from this issue on github: https://github.com/prettier/prettier/issues/3468.
printWidth is not a rule but an input into the algorithm they use to generate their output. Meaning, it is required to be there.
One workaround is to set printWidth to a really high number, but although this will prevent lines from breaking, changing this property will affect your entire codebase, causing other lines throughout it to combine into a single line, which is most likely not desired.
Your second option is to disable prettier for a block of code with the // prettier-ignore syntax. The downside to this is that you'll disable all prettier features for this section of the code. Also, I personally don't find it very "clean" to have comments like that all over your code.
You can read about how to use the ignore functionality here: https://prettier.io/docs/en/ignore.html
If you want to disable prettier rules once, just do:
// prettier-ignore
const date = new Date() // prettier disabled on this line
Sometimes clang-format does this :
SomeType VariableName[] = {Thing1,
Thing2,
Thing3}
and sometimes clang-format does this :
SomeType VariableName[] = {
Thing1,
Thing2,
Thing3}
and a single character change can make it switch between.
Is there any way to control which it does?
I'm building from the latest git source, so the latest options are available.
According to this answer, clang-format in some step puts as much as possible on a single line, and applies the ColumnLimit on that.
That would explain the switching between behaviors.
One way to prevent this could be to set ColumnLimit to 0, with the cost of removing all automatic wrapping. I think it's worth the cost, I'm sure other don't agree.
clang-format provide a way for user to specify a single property when format the code, such as whether tab is allowed, what is the tabwidth.
You could use the following way to tell clang-format to use a customized property.
$clang-format -style="{BaseonStype: llvm, IndentWidth: 8}"
$clang-format -style=HAND_WRITTEN_FORMAT_FILENAME
$clang-format -style=llvm #builtin styles.
You could get an idea about what property you could customize in the file from line 171 to line 266.
Okay, so I'm using Sublime Text 2 with Emmet. But "Tab" expansion of HTML snippets doesn't work inside a script because of the scope.
Example:
In HTML, I can type "h1" and then hit tab, and it will generate <h1></h1>
When using Ember.js, and more specifically Handlebars, it doesn't work.
<script type="text/x-handlebars">
h1
</script>
Pressing tab after that "h1" doesn't expand it because it's inside a script; Emmet turns this off. I can press Ctrl+E, which is the "expand anywhere" hotkey, and that works just fine. However, that is uncomfortable and prone to missing and hitting things like Ctrl+S or Ctrl+D which have undesired effects.
So, how can I change this?
I tweeted at the developer, and got a reply, https://twitter.com/chikuyonok/status/398708331969540096
But couldn't understand what to do.
In my opinion, he meant that you needed to change the scope for expand_abbreviation_by_tab. Please open Default (Windows/Linux/OSX).sublime-keymap, search expand_abbreviation_by_tab, add source.js in operand list. It makes it take affect in JavaScript file.
"command": "expand_abbreviation_by_tab",
"context": [
{
"operand": "source.js, source.css, source.sass, source.less, source.scss, source.stylus, text.xml, text.html - source, text.haml, text.scala.html, source string",
"operator": "equal",
"match_all": true,
"key": "selector"
},
I'll add further clarification here since this took me a while to find out:
Copy all of the two keys: ["tab"] objects from the Emmet default keybindings
Paste them into your User keybindings
Add source.handlebars as an additional operand to each of the two contexts.
This also works with Ember Syntax Highlighting when the handlebars files are being interpreted as Glimmer files.