타입 'JSX'에 속성이 존재하지 않는다고 타이프 스크립트가 불만을 제기합니다.React.createClass를 사용할 때 'Intelligent Elements'를 선택하십시오.
저는 레독스 어플리케이션을 작성하기 위해 타이프 스크립트를 사용하고 있습니다.
var item = React.createClass({
render: function() {
return (<div>hello world</div>)
}
});
export default class ItemList extends Component<any, any> {
render() {
return (<item />)
}
}
그러면 타이프 스크립트가 다음과 같이 불만을 제기합니다.
Property 'item' does not exist on type 'JSX.IntrinsicElements'.
구성 요소는 대문자로 시작해야 합니다.I
작은 글씨 대신i
그렇지 않으면 TypeScript가 비명을 지릅니다.변화하는item
로.Item
수정해야 합니다.
var Item = React.createClass({
render: function() {
return (<div>hello world</div>)
}
});
export default class ItemList extends Component<any, any> {
render() {
return (<Item />)
}
}
다음과 같이 사용자 지정 요소 유형을 선언할 수 있습니다.
import * as React from 'react'
declare global {
namespace JSX {
interface IntrinsicElements {
item: React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
}
}
}
그것은 당신의item
컴포넌트 이름이 대문자로 시작되지 않아 Typescript가 불만을 제기합니다.교환item
와 함께Item
이 문제를 해결할 수 있습니다.
이 일에 매달린 다른 사람을 위해.
해결책은
rm -rf node_modules
npm install
타이프 스크립트가 불만족
Property 'div' does not exist on type 'StyledInterface'.
그리고.
Property 'div' does not exist on type 'JSX.IntrinsicElements'.
근본 원인은 실수로 node_modules에서 유형 정의를 편집한 vscode(me)였다고 생각합니다.
내가 이 질문에서와 같은 문제를 가지고 있는 것처럼 보였지만, 그것은 오타였다:/ 그러나 나는 오류와 매우 비슷해 보였고 구글이 나를 여기로 이끌었기 때문에 나는 여기에서 그것을 공유하기로 결정했다.
신고서에 오타가 있었습니다.
declare global {
namespace JSX {
interface IntrinisicElements {
'about-me': { me: string }
}
}
}
IntrinicElements 대신 IntrinisicElements(Intrin 뒤에 i자를 추가)를 사용했습니다.컴파일러는 그것이 인터페이스의 정의이기 때문에 우리가 원하는 이름으로 할 수 있다고 불평하지 않았습니다.
오류는 다음과 같습니다.
'About-me' 속성이 'JSX' 유형에 없습니다.「Intelligent Elements(본질 요소)」.
주의: "항목"은 TypeScript에서 사용할 수 없습니다. "항목"으로 선언해야 합니다. 대문자는 첫 번째 문자입니다.다음과 같습니다.
var Item = React.createClass({
render: function() {
return (<div>hello world</div>)
}
});
안녕하세요!
이 문제는 를 눌러 태그 이름을 바꾼 경우에 발생할 수 있습니다.F2
태그의 타이핑이 변경될 수 있습니다.
이름이 바뀌었을 때index.d.ts
파일이 새 탭에서 열려 있어야 합니다.탭이 아직 열려 있는지 확인합니다.그 경로는 아마.../node_modules/@types/react/index.d.ts
.
탭을 찾으면 탭으로 이동한 다음 ctrl-z(cmd-z)를 눌러 변경을 취소합니다.
탭이 표시되지 않으면 닫았을 수 있습니다.단축키를 사용하여 최근에 닫은 탭을 다시 열어 보십시오.단축키를 모르는 경우 명령 팔레트를 사용합니다.View: Reopen Closed Editor
. 파일을 찾을 때까지 이 작업을 계속한 다음 변경 내용을 취소합니다.(VScode는 탭을 닫은 후에도 실행 취소에 대한 변경 내역을 기억합니다.)
Pascal Case를 사용하여 컴포넌트 이름을 작성하면 오류가 사라집니다.
하면 됩니다.
추가:
전::export default function jobAndIncome() {};
그후:export default function JobAndIncome() {};
언급URL : https://stackoverflow.com/questions/37414304/typescript-complains-property-does-not-exist-on-type-jsx-intrinsicelements-whe
'programing' 카테고리의 다른 글
스타일 컴포넌트와 리액트 부트스트랩? (0) | 2023.03.27 |
---|---|
AngularJS를 사용하여 옵션 텍스트 값을 얻는 방법 (0) | 2023.03.27 |
Springfox Swagger 2.0의 basePath를 변경하는 방법 (0) | 2023.03.22 |
개체와 해시의 차이점? (0) | 2023.03.22 |
@ComponentScan과 @Enable의 차이점은 무엇입니까?스프링 부트에서의 자동 설정 (0) | 2023.03.22 |