Error with 'no-unsafe-*' rules in Vite project
nicolas-goudry opened this issue · 1 comments
nicolas-goudry commented
First of all: thanks for this awesome project, I use it in all of my projects and it’s a breeze!
I have a Vite project using the react-ts
template. I setup xo and I’m having an issue with @typescript-eslint/no-unsafe-*
rules on the following code:
plugin.ts
export type BuildInfoFromRoot = {
git: {
branch: string
commitId: string
shortCommitId: string
commitTime: string | number
}
build: {
name: string
version: string
time: string | number
}
}
src/app.tsx
import type {BuildInfoFromRoot} from '../plugin'
const response = await fetch('/some-url')
// This is not OK for typescript-eslint
const data: BuildInfoFromRoot = await response.json()
function App() {
return <pre>{JSON.stringify(data, null, 2)}</pre>
}
export default App
However, if I declare the type locally, it works:
type BuildInfoFromLocal = {
git: {
branch: string
commitId: string
shortCommitId: string
commitTime: string | number
}
build: {
name: string
version: string
time: string | number
}
}
const response = await fetch('/some-url')
const data = (await response.json()) as unknown as BuildInfoFromLocal
And it’s also OK if I import the type from another file under the src
directory:
import type {BuildInfoFromSrc} from './main'
const response = await fetch('/some-url')
const data = (await response.json()) as unknown as BuildInfoFromSrc
I’m using the following configuration:
{
"extends": ["xo-react"],
"envs": ["browser", "es2022"],
"space": 2,
"semicolon": false,
"prettier": true,
"rules": {
"import/extensions": "off",
"import/order": [
"error",
{
"alphabetize": { "order": "asc", "orderImportKind": "asc", "caseInsensitive": true }
}
],
"n/file-extension-in-import": "off",
"no-console": "error",
"react/boolean-prop-naming": [
"error",
{
"rule": "^(is|has|should|can)[A-Z]([A-Za-z0-9]?)+",
"validateNested": true
}
],
"react/no-unknown-property": ["error", { "ignore": ["css"] }],
"react/react-in-jsx-scope": "off"
},
"overrides": [
{
"files": ["**/*.ts", "**/*.tsx"],
"rules": {
"@typescript-eslint/naming-convention": [
"error",
{
"selector": "variableLike",
"format": ["strictCamelCase", "UPPER_CASE", "PascalCase"],
"leadingUnderscore": "allow"
}
]
}
}
]
}
Here are my two TS config files:
tsconfig.json
{
"compilerOptions": {
"target": "ESNext",
"lib": ["DOM", "DOM.Iterable", "ESNext"],
"module": "ESNext",
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx",
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["src/**/*.ts", "src/**/*.tsx"],
"exclude": ["node_modules"],
"references": [{ "path": "./tsconfig.node.json" }]
}
tsconfig.node.json
{
"compilerOptions": {
"composite": true,
"skipLibCheck": true,
"module": "ESNext",
"moduleResolution": "bundler",
"allowSyntheticDefaultImports": true
},
"include": ["*.ts"]
}
Here is a repository reproducing the issue: https://github.com/nicolas-goudry/xo-ts-vite-no-unsafe
fregante commented
I don’t think this is related to XO. It should be opened on typescript-eslint’s repo