it-roy-ru.com

VSCode, Prettier и TSLint: formatOnSafe портит автосортировку импорта

Я создаю React приложения с помощью TypeScript. Мой редактор VSCode. Я использую красивее и TSLint, чтобы сохранить мой код в чистоте.

Так как несколько проектов, когда я нажимаю "безопасно", портят автосортировку:

Перед сохранением: Before save

После сохранения: After save

Я не знаю, почему это происходит в настоящее время, но это определенно вызвано более симпатичным (проверил это без того, красивее, это не происходит).

Мои настройки VSCode:

"editor.formatOnSave": true,
"editor.formatOnType": false,
"prettier.tslintIntegration": true,
"tslint.autoFixOnSave": false,

А вот мои настройки TSLint (tslint.json):

{
  "extends": [
    "tslint:recommended",
    "tslint-eslint-rules",
    "tslint-react",
    "tslint-config-prettier"
  ],
  "jsRules": {},
  "rules": {
    "interface-name": false,
    "jsx-no-lambda": false,
    "quotemark": [true, "single", "jsx-double"]
  }
}

Что может быть причиной этого? Я использовал эти настройки с другими проектами раньше, и они не перепутались (даже если я вернусь к ним и буду в безопасности). Кроме того, это только импорт, который испорчен, кроме того, красивее работает хорошо.

2
J. Hesters

Попробуйте добавить файл .prettierrc в корневой каталог вашего проекта и добавьте в него следующее: 

{
  "singleQuote": true
}

У меня была похожая проблема с Angular + TypeScript, и она, кажется, вызвана параметром singleQuote в Prettier. Расширение VS Code Prettier имеет опцию для установки предпочтительного стиля кавычек, но, похоже, в этом случае оно не учитывается.

1
Jared Parkinson

Почему бы не сказать Prettier игнорировать эту часть кода. как это:

// prettier-ignore
import { Styleheets } from 'react-native';
import fonts from '../../config/constants/fonts/';
import { companyBlack, companyGray } from '../../config/constants/colors';

Прочитайте по этому адресу: https://prettier.io/docs/en/ignore.html

0
Joshua Dela Cruz