인 IntelliJ 2016년 1월 4일 및 렌더링 반작용() 메소드

Question

I 내부 렌더링 방법은 구성 요소 반작용이 있습니다

import * as React from "react"; 
import MediaService from "./service/MediaService"; 
import ComponentLifecycle = require("@types/react"); 
import DOMHelper from "../helpers/DOMHelper"; 

export default class PictureTaker extends React.Component implements ComponentLifecycle { 
    // Not important 

    render() { 
     return (
      <article> 
       <video id="ra-video"> 
        Video not supported 
       </video> 
      </article> 
     ); 
    } 
} 

그것은 attribute id is not allowed here로 id 표시하지만, 확인을 - 나는 그것을 얻었다. 나는 다른 구성 요소에 <video>을 추출하는 코드를 리팩토링 할 :

import * as React from "react"; 

export default class VideoPlayer extends React.Component { 
    constructor() { 
     super(); 
    } 

    render() { 
     return (
      <video id="ra-video"> 
       Video not supported 
      </video> 
     ); 
    } 
} 

을하지만 메시지와 함께 brokes : unresolved type video. 여기에이 같은 모습입니다 :

VideoPlayer에 대한 코드 PictureTaker에서 붙여, 그리고 그것은 나를 놀라게. 나는 React 있습니다

그리고 React DOM : Settings/Languages and frameworks/Javascript/Libraries 내부

합니다. 나 한테 실수 한 거 있니? 모든 대답에 대해 미리 감사드립니다.

Answer 1

이런 해결책을 찾았습니다 ... .tsx 대신 .ts 확장을 사용했습니다. 그것은 VideoPlayer.ts이고, VideoPlayer.tsx이어야합니다.

Answer 2

비디오 란 무엇입니까? React.js와 함께 video.js를 가져와야합니다.