为什么Webpack在传递道具时会通过“首先使用类型定义先定义然后传递”和“直接传递”

Question

我正在使用打字稿，并共同做出反应，面对这个问题。

将对象类型prop传递给组件时，Webpack的行为有所不同。如果通过提供类型定义将该对象设置为局部变量，则它将不允许您使用不存在的道具。但是，如果您不使用类型定义或不将其初始化为局部变量而直接将对象传递给组件，则可以传递所需的任何内容，并且编译器不会给出任何错误。

我有一个名为Foo的组件，其中有一些道具。其中之一称为MyProperty类型的inputProps。

MyInputProps = Pick<React.HTMLProps<HTMLInputElement>, Exclude<keyof> React.HTMLProps<HTMLInputElement>, "onBlur">>. 

基本上，我尝试让API用户使用HTMLInputElement定义中可用的任何输入道具（“ onBlur”除外）。

所以，我有两种情况；

1-这给出了“对象文字只能指定知道属性，并且'onBlur'在...中不存在”的tslint警告，如果我尝试对其进行编译，则会出错。

const inputProps: MyInputProps = {  
    ...someInputProps,  
    onBlur: this.myHandleBlurFunction  
}

2-ts-lint都不发出警告，编译器也不给出任何错误。

const inputProps = {  
   ...someInputProps,  
   onBlur: this.myHandleBlurFunction  
}

OR

<Foo
   ...someComponentProps
   inputProps={{
       ...someInputProps,
       onBlur: this.myHandleBlurFunction
   }}
/>

为什么ts-lint和webpack在这些情况下的行为有所不同。我希望第二个示例也应获得警告和错误。我希望API用户在编译时而不是运行时失败。但是，使用我上面提供的第二种方法，API用户会欺骗编译器，但会在运行时失败。

是否有tsconfig参数来处理这种情况？