React-devtools: 구성 요소 이름 누락

자, 여기 빠른 업데이트가 있습니다. 구성 요소가 다음과 같이 노출되면 이름으로 Unknown 됩니다.

exports.MyComponent = React.createClass({...});

그러나 이것을 변경하면 작동하기 시작합니다.

var MyComponent = React.createClass({...});
exports.MyComponent = MyComponent;

확장 소스 코드를 확인했지만 tagName 이며 어떻게 설정되어 있는지 알 수 없습니다.

JSX를 사용하지 않는 경우 클래스에 displayName 속성을 추가해야 합니다.

var MyComponent = React.createClass({
  displayName: 'MyComponent',
  ...
});

JSX를 사용하는 경우 자동으로 수행됩니다. 불행히도 다른 방법은 없습니다.

예, JSX를 사용하고 있습니다. 따라서 다른 문제인 것 같습니다. 구성 요소가 exports.ComponentName = React.createClass() 선언된 경우 JSX 컴파일러는 displayName 기여할 수 없습니다.

이것은 그것을 담당하는 코드입니다: https://github.com/facebook/react/blob/master/vendor/fbtransform/transforms/reactDisplayName.js#L37

JSX는 이론적으로 형식도 지원할 수 있습니다. 이 문제는 ES6 클래스 또는 이와 유사한 것으로 이동하면 사라집니다.

tagName은 React 핵심에 있는 DOM 구성 요소의 일부입니다. displayName이 없습니다.

pull 요청을 보내려면 여기에 원하는 형식을 추가할 수 있습니다.

https://github.com/facebook/react/blob/ab47e992155ec9c2455b02bf671e8dd92bd01055/vendor/fbtransform/transforms/reactDisplayName.js#L37 -L51

알겠습니다. 감사합니다. 지금은 수동 displayName 이 작동합니다.

내가 생각할 수 있는 모든 경우에 대해 이것을 수정해야 하는 https://github.com/facebook/react/pull/799 를 방금 만들었습니다.

저는 크롬 플러그인 React Developer Tools 하고 있으며 React 트리를 검사할 때 구성 요소의 실제 이름 대신 '프록시 구성 요소'가 표시됩니다. webpack 문제일 수 있습니까? 'displayName'을(를) 추가하려고 시도했지만 그렇게 하지 않았습니다.

다른 사람이이 문제에 부딪쳤습니까?