jsソースマップからの反応成分を使用する

Question

短いストーリーで、私は自分のプロジェクトの1つで使用するリアクションを学ぼうとしています。私は今反応コンポーネント（https://github.com/mozilla-services/react-jsonschema-form）を使用しようとしていますが、CDNバージョンでどのように使用するのか分かりません。だから、そこjs fileと、コンポーネントが使用することを単純明快に見えますsource map

です：私が正しく理解している場合

const schema = { 
    title: "Todo", 
    type: "object", 
    required: ["title"], 
    properties: { 
    title: {type: "string", title: "Title", default: "A new task"}, 
    done: {type: "boolean", title: "Done?", default: false} 
    } 
}; 

const formData = { 
    title: "First task", 
    done: true 
}; 

const log = (type) => console.log.bind(console, type); 

render((
    <Form schema={schema} 
     formData={formData} 
     onChange={log("changed")} 
     onSubmit={log("submitted")} 
     onError={log("errors")} /> 
), document.getElementById("app")); 

は、CDNのアプローチを使用して、私はJSがちょうどを含めることができるはずです（と反応する/反応する - dom）それはうまくいくはずですか？唯一の私はエラーを取得する：

class Form extends Component 

それでは、どのように正確：私はJSファイルで見ると、私はマップでそれを見ていながら

embedded:18 Uncaught ReferenceError: Form is not defined 

、私は、指定されたフォームのコンポーネントが表示されませんこれを使うべきでしょうか？私が感じるように、ここに何かがありません。

Answer 1

フォームは、JSONSchemaFormモジュールをインポートしてエイリアシングした後の例でのみ使用できます。その理由は、それが縮小バージョンでは表示されません。

import Form from "react-jsonschema-form"; 

しかし、コンパイル済みのESモジュールは、CDNのバージョンでJSONSchemaFormとしてグローバル名前空間に追加され、手動でそのデフォルトのエクスポートプロパティにアクセスすることができます。

const Form = JSONSchemaForm.default; 

これをリアクタコンポーネントとして使用します。

ReactDOM.render((
    <Form schema={schema} 
    formData={formData} 
    onChange={log("changed")} 
    onSubmit={log("submitted")} 
    onError={log("errors")} /> 
), 
    document.getElementById("app") 
);