Comments (11)
To be fair, the signal-to-noise ratio in that elaboration is pretty low because it's all object literal types.
from typescript.
@Mng12345 https://www.typescriptlang.org/tsconfig#noErrorTruncation
There’s also a future feature being discussed and designed that might allow you to interactively expand truncations in VS Code.
from typescript.
There usually is more error elaboration than that. Without a full code example, it’s impossible to say why it’s not diving into EditForm
and CreateForm
.
from typescript.
There usually is more error elaboration than that. Without a full code example, it’s impossible to say why it’s not diving into
EditForm
andCreateForm
.
This is the minmum reproducing example.
type CreateApi = {
alarmType: number
alarmLevel: number
alarmPerson: { personName: string, concatInfo: string, deleted: boolean }[]
alarmTarget: ({
deleted: boolean
managementDep: number
associatedProjectId: number
} | {
deleted: boolean
managementDep: number
dataSetId: number
})[]
}
type EditApi = {
id: number
alarmType: number
alarmLevel: number
alarmPerson: { personName: string, concatInfo: string, deleted: boolean, id?: number }[]
alarmTarget: ({
deleted: boolean
managementDep: number
associatedProjectId: number
id?: number
} | {
deleted: boolean
managementDep: number
tableName: string
id?: number
})[]
}
type Detail = {
id: number
alarmTarget: {id: number, managementDep: number, dataSetId?: number, associatedProjectId?: number, deleted: boolean}[]
alarmPerson: {id: number, personName: string, concatInfo: string, deleted: boolean}[]
alarmType: number
alarmLevel: number
createTime: number
}
type AlarmPersonItem = Detail['alarmPerson'][0]
type AlarmTargetItem = Detail['alarmTarget'][0]
type AlarmPersonRecord = Pick<AlarmPersonItem, 'deleted'> & Partial<Omit<AlarmPersonItem, 'deleted'>> & {_id: string, _active: boolean}
type AlarmTargetRecord = Pick<AlarmTargetItem, 'deleted'> & Partial<Omit<AlarmTargetItem, 'deleted'>> & {_id: string, _active: boolean}
type CreateForm = Partial<Omit<CreateApi, 'alarmTarget' | 'alarmPerson'> & {alarmTarget?: AlarmTargetRecord[], alarmPerson: AlarmPersonRecord[]}>
type EditForm = Partial<Omit<EditApi, 'alarmTarget' | 'alarmPerson'> & {alarmTarget?: AlarmTargetRecord[], alarmPerson?: AlarmPersonRecord[]}>
const init = async () => {
const getDetail = (): Promise<Detail> => {
throw new Error('unimplemented')
}
const detail = await getDetail()
const createForm: CreateForm = {
...detail,
}
}
playground here
I know that the reason which causes type incompatible is because of the alarmTarget and alarmPerson are different between CreateForm and Detail, but it still need to take a few minutes to find out what the differences are, what i want to know is that are there some good ways or tools can help us locating the type incompatible problem more easily? thanks.
The situation described above is quite common in my business. I frequently encounter issues related to the incompatibility of complex tag union types, and it always takes me several minutes to troubleshoot each time. It's really tiring.
from typescript.
In the playground, the elaboration is fairly detailed and tells the full path of mismatched properties.
from typescript.
Yeah. It would probably be more readable if more of these types were defined as interface containing other interfaces rather than a deeply-nested literal type with aliases picking pieces out.
from typescript.
interface AlarmPerson { personName: string, concatInfo: string, deleted: boolean }
interface ProjectAlarmTarget {
deleted: boolean
managementDep: number
associatedProjectId: number
}
interface TableAlarmTarget {
deleted: boolean
managementDep: number
dataSetId: number
}
interface CreateApi {
alarmType: number
alarmLevel: number
alarmPerson: AlarmPerson[]
alarmTarget: (ProjectAlarmTarget | TableAlarmTarget)[]
}
interface EditAlarmPerson extends AlarmPerson {
id?: number
}
interface EditProjectAlarmTarget extends ProjectAlarmTarget {
id?: number
}
interface EditTableAlarmTarget extends TableAlarmTarget {
id?: number
}
interface EditApi {
id: number
alarmType: number
alarmLevel: number
alarmPerson: EditAlarmPerson[]
alarmTarget: (EditProjectAlarmTarget | EditTableAlarmTarget)[]
}
interface DetailAlarmTarget {
id: number, managementDep: number, dataSetId?: number, associatedProjectId?: number, deleted: boolean
}
interface DetailAlarmPerson {
id: number, personName: string, concatInfo: string, deleted: boolean
}
interface Detail {
id: number
alarmTarget: DetailAlarmTarget[]
alarmPerson: DetailAlarmPerson[]
alarmType: number
alarmLevel: number
createTime: number
}
interface AlarmPersonRecord {
id?: number, personName?: string, concatInfo?: string, deleted: boolean, _id: string, _active: boolean
}
interface AlarmTargetRecord {
id?: number, managementDep?: number, dataSetId?: number, associatedProjectId?: number, deleted: boolean, _id: string, _active: boolean
}
interface CreateForm {
alarmType?: number
alarmLevel?: number
alarmPerson?: AlarmPersonRecord[]
alarmTarget?: DetailAlarmTarget[]
}
interface EditForm {
id: number
alarmType?: number
alarmLevel?: number
alarmPerson?: AlarmPersonRecord[]
alarmTarget?: AlarmTargetRecord[]
}
const init = async () => {
const getDetail = (): Promise<Detail> => {
throw new Error('unimplemented')
}
const detail = await getDetail()
const createForm: CreateForm = {
...detail,
}
}
playground here
I have replaced all type aliases and object literal types with interfaces, and now the error messages are simpler and clearer. However, due to the large number of interfaces I have written, I am finding it difficult to remember some of the interface names. Is there a best practice for deciding when to choose between using an interface and a type?
from typescript.
Vscode may omit some type definitions. How can I expand them?
from typescript.
This issue has been marked as "Question" and has seen no recent activity. It has been automatically closed for house-keeping purposes.
from typescript.
@andrewbranch I found that noErrorTruncation can cause ordinary hover tooltips to slow down significantly.
from typescript.
May be we can push this function into the tooltips dialog, let it expanding by user.
from typescript.
Related Issues (20)
- Wrong type narrowing on union type. HOT 2
- Document link for reference types and path
- object with `?:` property type, spread last --> allowed (but shouldn't) HOT 3
- Add a flag to require JS object literals to be initialized with all declared members HOT 4
- Type inference lost after spreading array with `ArrayLike` HOT 1
- Regular Expression finds HOT 4
- "This comparison appears to be unintentional" and control flow analysis with a variable updated in lambda HOT 4
- Classes static generic function return `any` type. HOT 2
- Is assignment not allowed here? HOT 2
- Editor changes overload resolution based on syntax HOT 6
- TS cache corruption leads to "error TS2590: Expression produces a union type that is too complex to represent" HOT 1
- Type alias circularly references itself (5.4 regression) HOT 1
- error TS2385: Overload signatures must all be public, private or protected. HOT 2
- `export type * ...` statements in `.d.ts` files do not work (5.4 regression) HOT 4
- HTMLFormElement disallows symbol keys HOT 6
- TypeScript language service cannot find subclass references/implementation of mixin methods
- when using ts.getJSDocTags, the value of @type is not returned. Is there any solution? HOT 2
- Compiler allows narrower method signature than implemented interface HOT 7
- Allow overload signatures to have different access levels HOT 3
- Watcher recursively watches irrelevant directories HOT 13
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from typescript.