Prettier breaks the import statement into two lines

Question

I am trying to prevent prettier from breaking my code. Current setup causes an import statement that is 125 characters long to break into 2 lines which results in an error.

import DiagnosticsResponseMessageContainer from 'components/DiagnosticsResponseMessage/DiagnosticsResponseMessageContainer';

The import line looks like this after save, and I get red squeaky lines under from saying that I need { to fix it:

import DiagnosticsResponseMessageContainer, 
from 'components/DiagnosticsResponseMessage/DiagnosticsResponseMessageContainer';

Tried changing printWidth value to 250, 1000, and 5000 but it didn't affect the behaviour.
Checked if I'm using any other similar tools such as Beautify, but I'm not.
Added the recommended package tslint-config-prettier to make sure tslint/prettier working together not causing this issue
Tried adding // prettier-ignore before the import line. Didn't change anything

This is the output of prettier after save:

["INFO" - 11:25:39 AM] Detected local configuration (i.e. .prettierrc or .editorconfig), VS Code configuration will not be used
["INFO" - 11:25:39 AM] Prettier Options:
{
  "filepath": "***",
  "parser": "typescript",
  "bracketSpacing": true,
  "printWidth": 250,
  "semi": true,
  "singleQuote": true,
  "jsxSingleQuote": true,
  "tabWidth": 2,
  "trailingComma": "es5",
  "useTabs": false,
  "quoteProps": "preserve"
}
["INFO" - 11:25:39 AM] Formatting completed in 0.091ms.

What might be the problem here?

Prettier breaks the import statement into two lines

0 Answers0