타입 '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 |