How to disable vscode auto format adding newline at EOF when auto save js files? - visual-studio-code

Question

I am using vscode and enabled the auto-format config to format files when saving files.
But i recently found that vscode editor always add a newline at EOF of each js file,so how to disable this?
I have specially added the config "files.insertFinalNewline": false, but it still not worked.
vscode info:
Version: 1.33.1 (system setup)
Commit: 51b0b28134d51361cf996d2f0a1c698247aeabd8
Date: 2019-04-11T08:27:14.102Z
Electron: 3.1.6
Chrome: 66.0.3359.181
Node.js: 10.2.0
V8: 6.6.346.32
OS: Windows_NT x64 6.1.7601
vscode config.json
{
"workbench.colorTheme": "Monokai",
"editor.fontSize": 16,
"editor.formatOnPaste": true,
// Format a file on save.
// A formatter must be available,
// the file must not be auto-saved,
// and editor must not be shutting down.
"editor.formatOnSave": true,
"debug.console.fontSize": 16,
"terminal.integrated.fontSize": 14,
"markdown.preview.fontSize": 14,
"window.zoomLevel": 1,
"editor.renderWhitespace": "all",
"window.title": "${dirty}${activeEditorLong}${separator}${rootName}${separator}${appName}",
"search.exclude": {
"**/.gitignore": true,
"**/.idea": true,
"**/.vscode": true,
"**/build": true,
"**/dist": true,
"**/tmp": true,
"**/yarn.lock": true
},
"workbench.iconTheme": "material-icon-theme",
"editor.wordWrapColumn": 110,
"http.proxyStrictSSL": false,
"files.trimTrailingWhitespace": true,
"files.insertFinalNewline": false,
"files.trimFinalNewlines": false,
"html.format.endWithNewline": false,
"javascript.implicitProjectConfig.experimentalDecorators": true,
// Enable/disable default JavaScript formatter (For Prettier)
"javascript.format.enable": false,
// Use 'prettier-eslint' instead of 'prettier'.
// Other settings will only be fallbacks
// in case they could not be inferred from eslint rules.
"prettier.eslintIntegration": true,
"prettier.tabWidth": 4,
"prettier.singleQuote": true,
"prettier.arrowParens": "always"
}
.eslintrc.json
{
"extends": "airbnb",
"plugins": [
"react",
"jsx-a11y",
"import",
"react-hooks"
],
"parserOptions": {
"sourceType": "module",
"ecmaFeatures": {
"legacyDecorators": true,
"experimentalObjectRestSpread": true
}
},
"env": {
"browser": true,
"es6": true
},
"parser": "babel-eslint",
"globals": {
"describe": true,
"it": true,
"inject": true,
"beforeEach": true,
"addProviders": true,
"spyOn": true,
"expect": true,
"global": true,
"require": true,
"async": true,
"ENVIRONMENT": true,
"client": true
},
"rules": {
"linebreak-style": 0,
"quotes": [2, "single", {
"avoidEscape": true,
"allowTemplateLiterals": true
}],
"indent": [2, 4, {
"SwitchCase": 1,
"VariableDeclarator": 1
}],
"react/jsx-indent": [2, 4],
"comma-dangle": ["error", "never"],
"class-methods-use-this": 0,
"import/newline-after-import": 0,
"space-before-function-paren": ["error", "never"],
"func-names": ["error", "never"],
"consistent-return": [0],
"eol-last": ["error", "never"],
"no-script-url": ["off"],
"react/jsx-indent-props": [2, 4],
"react/forbid-prop-types": [2, {
"forbid": []
}],
"jsx-a11y/anchor-is-valid": ["error", {
"components": ["Link"],
"specialLink": ["to"],
"aspects": ["noHref"]
}],
"jsx-a11y/href-no-hash": "off",
"jsx-a11y/no-static-element-interactions": "off",
"jsx-a11y/click-events-have-key-events": "off",
"import/no-unresolved": [
"error",
{
"ignore": ["client/"]
}
],
"import/no-extraneous-dependencies": [
"error",
{
"devDependencies": true
}
],
"import/extensions": 0,
"max-len": [
0, 110, 4
],
"react/jsx-filename-extension": [
1,
{
"extensions": [
".js",
".jsx"
]
}
],
"react-hooks/rules-of-hooks": "error"
},
"settings": {
"import/resolver": {
"node": {
"extensions": [".js", ".jsx", ".json", ".css"]
}
}
}
}
So, how to config vscode correctly?

Answer 1

I had the same problem. To fix it you need to be in the folder of your project. then open your settings i.e command + shift + p, type settings, select Preferences: open settings UI, under Text Editor tab, choose Files and you'll find Eol tab to choose from \n, \n, auto. I choose auto so it will override whatever you specify.