Visual Studio Code и TSLint: перенос кода более чем на 80 символов - PullRequest
Новая
       38

Visual Studio Code и TSLint: перенос кода более чем на 80 символов

0 голосов
/ 15 октября 2018

Я использую TypeScript с TSLint и Prettier в коде Visual Studio для написания собственного приложения React.

Я попытался настроить свой редактор так, чтобы код автоматически упаковывался в каждую строку до 100 символов.Но после сохранения всегда 80 символов, а не 100.

Вот настройки, которые я изменил: 

"prettier.tslintIntegration": true,
"prettier.printWidth": 100,
"editor.renderIndentGuides": true,
"editor.rulers": [100],
"editor.wordWrapColumn": 100,
"editor.formatOnSave": true

А это мои tslint.json: 

{
  "extends": ["tslint:recommended", "tslint-react", "tslint-config-prettier"],
  "rules": {
    // "jsx-no-lambda": false,
    "member-access": false,
    "interface-name": false,
    "max-line-length": [true, 100]
  }
}

Несмотря на то, что я все настроил таким образом, мой код автоматически переносит около 80 символов.Как я могу остановить это?

Если моя строка превышает 100 символов, я получаю сообщение об ошибке, поэтому настройка tslint.json работает.

Бонус: завершите настройки VSCode в случае, если ячто-то пропустил: 

{
  "telemetry.enableTelemetry": false,
  "workbench.colorTheme": "One Dark Pro",
  "workbench.iconTheme": "vscode-icons",
  "window.zoomLevel": 0,
  "prettier.eslintIntegration": true,
  "prettier.tslintIntegration": true,
  "prettier.printWidth": 100,
  "editor.renderIndentGuides": true,
  "editor.rulers": [100],
  "[javascript]": {
    "editor.tabSize": 2
  },
  "[typescript]": {
    "editor.tabSize": 2
  },
  "[typescriptreact]": {
    "editor.tabSize": 2
  },
  "[json]": {
    "editor.tabSize": 2
  },
  "workbench.colorCustomizations": {
    // "statusBar.background": "#272b33",
    // "panel.background": "#30353f",
    // "sideBar.background": "#2a2b33",
    "editor.background": "#2c313a"
  },
  "todohighlight.keywords": [
    {
      "text": "DEBUG:",
      "color": "#fff",
      "backgroundColor": "limegreen",
      "overviewRulerColor": "grey"
    },
    {
      "text": "NOTE:",
      "color": "#fff",
      "backgroundColor": "mediumslateblue",
      "overviewRulerColor": "grey"
    },
    {
      "text": "REVIEW:",
      "color": "#fff",
      "backgroundColor": "dodgerblue",
      "overviewRulerColor": "grey"
    },
    {
      "text": "XXX:",
      "color": "#fff",
      "backgroundColor": "orangered",
      "overviewRulerColor": "grey"
    }
  ],
  "editor.wordWrapColumn": 100,
  "editor.formatOnSave": true
}

Ответы [ 2 ]

0 голосов
/ 18 февраля 2019

В tslint.json вы сможете добавить printWidth в раздел конфигурации Prettier: 

"rules": {
    "prettier": [
        true,
        {
            "printWidth": 100
        }
    ],
0 голосов
/ 22 октября 2018

Этих двух должно быть достаточно: 

"editor.wordWrap": "wordWrapColumn",
"editor.wordWrapColumn": 100

Похоже, "editor.wordWrap" отсутствует в ваших настройках.В vscode этот параметр управляет политикой переноса: «wordWrapColumn» означает перенос при настройке "editor.wordWrapColumn".

Вы также можете попробовать "editor.wordWrap": "bounded", который будет учитывать «wordWrapColumn», но также переносить, если ваш видовой экран меньше чем nuber ofстолбцы, которые вы определяете.

UPD: Судя по нашему обсуждению в комментариях, кажется, что симпатичнее не соблюдаются настройки "printWidth".Возможны две наиболее вероятные причины:

  1. Эта проблема: https://github.com/prettier/prettier-vscode/issues/595
  2. Приоритеты для определения параметров конфигурации: https://github.com/prettier/prettier-vscode#prettiers-settings. В частности, сначала выполняется поискдля более красивых файлов конфигурации , чем для .editorconfig файлов, и только затем для настроек vscode.

В качестве обходного пути вы можете попытаться определить этот параметр на самом делев более красивом конфигурационном файле для вашего проекта или в файле editorconfig и проверьте, будет ли плагин vscode работать с любым из них.

...