Я использую Webpack 2, и он скажет мне, если есть проблемы с компиляцией с моим машинописным кодом. Однако я не нашел способа запустить tslint через него и запускать его при каждом изменении, обнаруженном веб-пакетом, когда он работает в режиме dev-server.

Я пытался заставить работать tslint-loader, но для каждого файла в моем проекте это просто говорит меня:

/src/main.tsНе указаны действительные правила

Я использую это как так:

rules: [
  {
    test: /\.ts$/,
    enforce: 'pre',
    loader: 'tslint-loader',
    options: {
      configuration: {
        configFile: true // I have also tried setting this to "tslint.json"
      }
    }
  },
  ... more loaders...

Все еще нет радости.

Есть ли способ:

  1. tslint-loader, который я использую, сообщает мне об ошибках lint в webpack-dev- режим сервера каждый раз, когда я делаю изменения?
  2. Просто запустите tslint из командной строки, и он будет постоянно «смотреть» файлы в моем проекте? Я ищу что-то вроде tslint ./src/**/*.ts -t --force, но с дополнительным флагом --watch, который не существует в соответствии с tslint docs.

Я бы предпочел не использовать мой редактор (например, VS Code), так как не все в моей команде используют его. Я бы предпочел, чтобы решение содержалось либо в конфиге webpack, либо в скриптах package.json.

Спасибо!

7
tengen 28 Фев 2017 в 20:52

2 ответа

Лучший ответ

Что касается скрипта, который вы можете запустить из командной строки, вы можете попробовать использовать npm-watch: https://www.npmjs.com/package/npm-watch.

Я использовал это, чтобы успешно делать то, о чем вы говорите. Вот что я сделал:

Установил npm-watch для моего проекта:

$ npm install npm-watch --save-dev

Добавил следующее в мой файл package.json:

"watch": {
    "lint": "src/main.ts"
},
"scripts": {
    "lint": "tslint src/**/*.ts -t verbose",
    "watch": "npm-watch"
},

Я считаю, что npm-watch - это хороший инструмент для предоставления функциональности часов тем инструментам, у которых ее нет, например, tslint.

< Сильный > Update :

Кроме того, если вы не хотите добавлять раздел «watch» в ваш файл package.json, я на самом деле только что обнаружил новый инструмент, который мне нравится, еще лучше называется chokidar. Это позволяет вам указать селекторы файлов и команды, которые вы хотите запустить, все в одной строке.

Вот мой обновленный package.json:

"scripts": {
    "lint:watch": "chokidar webpack.config.* src/**/*.ts buildScripts/**/*.ts -c \"npm run lint\" --initial --verbose"
},

В основном вы предоставляете ему один или несколько селекторов файлов, а затем используете параметр '-c', чтобы указать команду, которую вы хотите выполнить при изменении любого из этих файлов.

Так что теперь вы можете просто запустить команду:

$ npm run lint:watch

Мне нравится запускать его с установленным флагом --initial, чтобы он не ждал изменения файлов перед выполнением команды.

13
jalbr74 3 Мар 2017 в 17:59

Если вы используете TypeScript, то вы, вероятно, можете использовать tsc -w для просмотра изменений.

 "scripts": {
    "start": "tsc -w",
  }
1
Ishan Patel 29 Июл 2019 в 07:25