TSLint не работает с CRA и TypeScript - PullRequest
0 голосов
/ 04 января 2019

Я несколько часов бьюсь головой, пытаясь включить линтинг для проекта TypeScript, созданного с помощью create-реагировать-app.

Проблема в том, что предложенная реализация выше не добавляет никакихпривязка к недавно созданному проекту.

Пока что я пробовал:

  • Установка TypeScript TSLint Plugin в качестве расширения моего VSCode
  • Создание файла tslint.json в моем проекте со следующей конфигурацией:
  {
    "rules": {
      "no-debugger": false,
      "no-console": false,
      "interface-name": false
    },
    "linterOptions": {
      "exclude": [
        "config/**/*.js", "node_modules/**/*.ts", "coverage/lcov-report/*.js"
      ]
    },
    "extends": [
      "tslint:recommended", 
      "tslint-react", 
      "tslint-config-prettier"
    ]
  }
  • Добавление сценария lint в мой package.json
 "scripts": { 
     "lint": "tslint -c tslint.json src/**/*.{ts,tsx} --fix --format verbose"
 }

Затем я попытался запустить yarn lint or npm run lint, но ни один из описанных выше подходов не запутал файлы

Это мой package.json файл:

{
  "name": "myapp",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@types/jest": "^23.3.11",
    "@types/node": "^10.12.18",
    "@types/react": "^16.7.18",
    "@types/react-dom": "^16.0.11",
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-scripts": "2.1.2",
    "typescript": "^3.2.2"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "lint": "tslint -c tslint.json src/**/*.{ts,tsx} --fix --format verbose",
    "tslint-check": "tslint-config-prettier-check ./tslint.json"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "devDependencies": {
    "tslint": "^5.12.0",
    "tslint-config-prettier": "^1.17.0",
    "tslint-react": "^3.6.0"
  }
}

Этоtsconfig.json автоматически генерируется приложением npx create-Reaction-app [имя-проекта] --typescript

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "preserve"
  },
  "include": [
    "src"
  ]
}

Any мысли?

1 Ответ

0 голосов
/ 05 января 2019

Мне пришлось пройти через тот же процесс, чтобы понять, как заставить TSLint и Pretter работать над проектом CRA + TypeScript.

Я создал этот gist с пошаговым-step инструкции о том, как его настроить соответствующим образом.

Вкратце вышеприведенное решение состоит в том, чтобы убедиться, что у вас установлены соответствующие расширения VSCode и соответствующие зависимости в вашем package.jsonпоэтому ваши изменения отслеживаются как TSLint, так и Prettier.

...