我花了几个小时绞尽脑汁试图为使用 create-react-app 创建的 TypeScript 项目启用 linting。
- The wmonk/create-react-app-typescript https://github.com/wmonk/create-react-app-typescript回购协议现已弃用
- 因此,我遵循these https://facebook.github.io/create-react-app/docs/adding-typescriptCRA 文档中的说明
问题是上面建议的实现不会向新创建的项目添加任何 linting。
到目前为止我已经尝试过:
- 安装中TypeScript TSLint 插件 https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-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"
]
}
- 添加一个皮棉脚本 to my
package.json
"scripts": {
"lint": "tslint -c tslint.json src/**/*.{ts,tsx} --fix --format verbose"
}
然后我尝试跑步yarn lint or npm run lint
但上述任何方法都不会检查任何文件
这是我的package.json
file:
{
"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-react-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"
]
}
有什么想法吗?