Prevent Flutter/Dart format reordering variable declarations - flutter

Is there a way to prevent the dart formatter from reordering variables alphabetically? I can't find a linting rule for it although there's the similar directives_ordering for imports.
For example
var variableA; //A
var variableC; //C
var variableB; //B
gets reordered to
var variableA; //A
var variableB; //C
var variableC; //B
leaving comments in place.
This is especially problematic when I group constants together with a similar purpose and they get split up/mixed with other different constants making the accompanying comments useless/confusing.
I'm using Flutter 2.5.0 on VSCode 1.60.0 with include: package:flutter_lints/flutter.yaml in my analysis_options.yaml file.
Thanks for your help

For me it turns out this was due to the dart plugin for VSCode. Specifically the source.sortMembers value in the editor.codeActionsOnSave of my VSCode configuration file.
Setting this to false stops the variables being reordered.
The same behavior happens if you press CTRL + Shift + P and run Dart: Sort Members.

Apply it for the entire project
Open your analysis_options.yaml file
add this line to it
directives_ordering: false
Complete code
include: package:flutter_lints/flutter.yaml
linter:
rules:
# avoid_print: true # Uncomment to disable the `avoid_print` rule
# prefer_single_quotes: true # Uncomment to enable the `prefer_single_quotes` rule
directives_ordering: false

Related

How to enable camelCase warning in VS Code [Dart]

It is shown as underlined when naming wrong while writing code in Android Studio. However, I did not see such a thing in VS Code. Is there a way to turn it on or is there no such feature?
I think you are trying to 2 do things at once here.
First, dart has 2 lints rules that ensure your code is using camelCase
non_constant_identifier_names
constant_identifier_names
The rules are by default included in the recommended set of lint rules.
They prevent you from writting:
const PI = 3.14;
const kDefaultTimeout = 1000;
final URL_SCHEME = RegExp('^([a-z]+):');
class Dice {
static final NUMBER_GENERATOR = Random();
}
var Item;
HttpRequest http_request;
ALIGN(clearItems) {
// ...
}
But they don't prevent you from writing
var userage;
var familyname;
var studentnumber;
because those names verify the camelCase regexp.
userAge is a combination of 2 words ("user" and "age").
userage implies your variable is one single word ("userage"). This word doesn't exist in English but dart doesn't know that.
What you want now is to verify the spelling of your variables.
You can install the VSCode extension cSpell for that and it will verify that each sub-words of a variable exist and are properly spelled.
Install Camel Case Navigation Extensions
Download from here or Go to Extensions or search "Camel Case Navigation"

How to change autocompletes in VS Code?

Whenever I have a form, and I want to create an object or something, I use document.getElementById('example').value. Thing is, the first time I type 'value' in a new JS file and then enter my comma or semicolon, 'value' changes to ariaValueMax. I know this is a minor inconvenience at worst, but is there any way I can change this? This happens everytime I make a project with JavaScript.
Also, when I'm in my server.js file, sometimes I forget to create a variable before trying to do something with it in express. So if I type something like this:
const express = require('express');
app.listen.....
I end up with this:
const express = require('express');
const { appendFile } = require('fs');
appendFile.listen......
Is there any way I can change this settings as well? (the one where it auto creates the require('fs') line)
I can only answer your first question: You have to edit settings.json to tell Intellisense to not accept autocomplete on your "commit character" (in this instance, the semicolon). So first, you have to edit that file:
Windows %APPDATA%\Code\User\settings.json
MacOS $HOME/Library/Application Support/Code/User/settings.json
Linux $HOME/.config/Code/User/settings.json
Then, add the following JSON node:
"editor.acceptSuggestionOnCommitCharacter": false
Finally, restart your editor, and it should be good to go. Here is an example of my settings.json file:
{
"go.formatTool": "goimports",
"editor.acceptSuggestionOnCommitCharacter": false
}

Fix all const warning flutter

How to fix this all const warning in VSCode? It's hard if I fix one by one.
If you want to add const everywhere in the code, take a look at dart fix and here is a similar question answered.
If you just want to hide all the warnings, you can add
// ignore_for_file: prefer_const_constructors
anywhere in the file.
Or, if you want to get rid of it in all files, find analysis_options.yaml in the root of your project and set the property to false:
If there is no such file (analysis_options.yaml), you can create one and set it to false.
Code the of image file:
rules:
prefer_const_constructors : false
file_names : false
public_member_api_docs: false
lines_longer_than_80_chars: false
avoid_catches_without_on_clauses: false
avoid_equals_and_hash_code_on_mutable_classes: false
prefer_relative_imports: false
type_annotate_public_apis: false
avoid_types_on_closure_parameters: false
sort_constructors_first: false
prefer_generic_function_type_aliases: true
unnecessary_lambdas: true
use_key_in_widget_constructors: false
avoid_print: false
Simply right click on any of the warning in the problems tab in vscode and choose Add const modifiers everywhere in the file.
But you have to do it manually for all files in your project.
Better solution:
Open Vscode : settings -> open settings.json file
Copy paste following lines
"editor.codeActionsOnSave": {
"source.fixAll": true
}
You can find the settings.json file in 'C:\Users<user-name>\AppData\Roaming\Code\User'
Thats it,From now whenever you're saving a file it will apply the quick fix ( adding const in all places). All you have to do is just save your files.
Note :
It will not only fix the const problem but also fixes some other lint warnings like removing unused imports.
I'm Using visual Studio Code for Flutter app development. you can add
"editor.codeActionsOnSave": {
"source.fixAll": true
}
this to Settings.json file and Editor will auto add const and other fixes. for Find Setting.json you have follow this step
Ctrl + Shift + P -> Search Setting.json -> add above code.
See Flutter Fix
To apply all changes in bulk, run the following command:
dart fix --apply
write it inside terminal
dart fix --apply
(it will takes some seconds and dart fix fixes deprecated lints in analysis_options.yaml files where possible, by:
removing them, or possibly
replacing them with another preferred lint)

How to avoid VsCode Prettier to break chain functions in new lines.?

I'm working with VSCode, Prettier and TSLint.
When I do have chained functions call with more than 2 calls like
let m = moment().startOf("day").subtract(30, "days");
Prettier breaks into
let m = moment()
.startOf("day")
.subtract(30, "days")
I already set the TSLint rule
{
"defaultSeverity": "warning",
"extends": ["tslint:recommended"],
"linterOptions": {
"exclude": ["node_modules/**"]
},
"rules": {
// ...
"newline-per-chained-call": false
}
}
and the fallowing settings
"prettier.tslintIntegration": true
But the chained functions still breking into new lines.
What can I do to avoid the line breaking but still using the TSLint?
[EDIT] In Prettier v2.0.4 this issue is fixed. Update to latest version
This is an issue in prettier. The PR's to add this feature has not yet been merged from what i understand.
Currently to get what you want, what i can suggest is to ignore the next node in the abstract syntax tree from formatting using the // prettier-ignore comments.
// prettier-ignore
let m = moment().startOf("day").subtract(30, "days");
There are variations of these ignore statements, like one could ignore within a ranger or one could even ignore a particular file too. Do check out the official prettier documentations to know more of it's implementation.
Note that in Prettier v2.0.4 this issue is fixed. Now, as long as your line of code is within the length specified in your config or the default 80, it will be left in one line. Otherwise, it will be wrapped to multiple lines.
I had to upgrade my prettier in order for these changes to be put into affect.
$ yarn upgrade -g prettier --latest

Eslint & SAPUI5: How to remove "sap/$ not defined"?

I am using Eslint in Visual Code for my SAPUI5 project. Whenever I am defining a controller using
sap.ui.define([...
Eslint throws the error sap not defined.. The same holds for $/jQuery. Is there a way how to solve that?
Thanks
You can whitelist global variables in the eslint configuration: https://eslint.org/docs/user-guide/configuring (see "Specifying Globals").
To configure global variables inside of a configuration file, use the
globals key and indicate the global variables you want to use. Set
each global variable name equal to true to allow the variable to be
overwritten or false to disallow overwriting. For example:
{
"globals": {
"var1": true,
"var2": false
}
}
Usually you have some kind of .eslintrc.js file where you can include this.
Here is an example: https://github.com/pulseshift/openui5-gulp-starter-kit/blob/master/.eslintrc.js