Пользовательское правило TSLint в TypeScript с Angular 7 и `ng lint`

#angular #typescript #angular-cli #tslint

#angular #typescript #angular-cli #tslint

Вопрос:

У меня появилось новое рабочее пространство для библиотеки, которую я поддерживаю. У нас есть 2 пользовательских правила TSLint, которые мы использовали в Angular 5, которые не использовали Angular CLI. Теперь мы переходим к Angular CLI и Angular 7.

Одна вещь, над которой мы работали, заключалась в том, что нам не нужно было компилировать эти правила TSLint в JS, прежде чем TSLint их получит. Однако это требовало ts-node использования в нашем package.json скрипте lint.

Как я могу сообщить ng , чтобы получить эти файлы правил TSLint в TypeScript?

tsconfig.json projects/my-lib/src )

 {
  "rulesDirectory": "./lib/tslint-rules"
}
  

Затем в нашей основной рабочей области мы расширяем это tsconfig из библиотеки и добавляем наше пользовательское правило.

 Could not find implementations for the following rules specified in the configuration:
    my-custom-tslint-rule
Try upgrading TSLint and/or ensuring that you have all necessary custom rules installed.
If TSLint was recently upgraded, you may have old rules configured which need to be cleaned up.
  

Комментарии:

1. ознакомьтесь с этой статьей blog.rangle.io/custom-tslint-for-angular . согласно им, это зависит от версии tslint, нужно ли вам компилировать правило в JS или нет. не должно быть связано с использованием angular-cli или нет

2. По иронии судьбы, это мой пост в блоге. В этом случае я закончил тем, что использовал ts-node для запуска linter. Теперь я хочу использовать ng для запуска ограничения, если это возможно

Ответ №1:

Хорошо, итак, я разобрался с этим. Есть несколько вещей, которые вам нужно сделать, если вы хотите включить пользовательские правила TSLint в свою библиотеку Angular.

  1. Убедитесь, что они экспортируются в вашем public_api.ts . Это гарантирует, что при запуске ng build <library-name> компилятор TypeScript подберет эти файлы, скомпилирует их и поместит в dist папку.

  2. Настройте свой tsconfig.lib.json на использование модулей, отличных от es6 / es2015. Это то, что вызывало у меня много проблем. Похоже, что TSLint не поддерживает модули в стиле es2015. Я переключил его на использование umd вместо этого. (Я также отметил, что это commonjs тоже отлично работало.)

 {
  "compilerOptions": {
    ...
    "module": "umd",
  }
}
  
  1. В любом проекте, где установлена эта библиотека, вы можете выбрать свои правила, выполнив следующее. Отредактируйте свои tslint.json и добавьте установленные tslint-правила node_modules к вашим tslint.json . Затем добавьте свои конкретные правила в список правил.
   "rulesDirectory": [
    // ...,
    "node_modules/<my-package>/esm2015/lib/tslint-rules"
  ],
  

Затем добавьте настроенное правило следующим образом:

   "rules": {
    // ...,
    "my-custom-rule": true,
    // ...
  }
  
  1. Кроме того, вы также можете настроить tslint-default.json в своей библиотеке и скопировать это в свою папку dist после запуска ng build . При этом должен быть добавлен каталог правил и настройки по умолчанию для ваших пользовательских правил.

Затем, когда вы устанавливаете этот пакет в другом месте, вам нужно только расширить его tslint-default.json из установленной папки node_modules.

Надеюсь, это поможет всем, кто пытается создать библиотеку Angular и включить пользовательские правила TSLint.