title: SPLoaderError.loadComponentError: Failed to load component
body: <p>Developed a SharePoint app in SPFX Framework, when I compile it with gulp build it compiles fine, however when I do gulp serve and I add the app to the workbench and get this following error:</p>
  
  <blockquote>
    <p>[SPLoaderError.loadComponentError]:***Failed to load component "6d68696e-6767-4686-9cd4-60788de11f47" (DocumentUploadWebPart). 
    Original error: ***Failed to load entry point from component "6d68696e-6767-4686-9cd4-60788de11f47" (DocumentUploadWebPart).
    Original error: Error loading <a href="https://component-id.invalid/6d68696e-6767-4686-9cd4-60788de11f47_0.0.1" rel="nofollow noreferrer">https://component-id.invalid/6d68696e-6767-4686-9cd4-60788de11f47_0.0.1</a> external__react_.createClass is not a function
    ***INNERERROR:***Failed to load entry point from component "6d68696e-6767-4686-9cd4-60788de11f47" (DocumentUploadWebPart).
    Original error: Error loading <a href="https://component-id.invalid/6d68696e-6767-4686-9cd4-60788de11f47_0.0.1" rel="nofollow noreferrer">https://component-id.invalid/6d68696e-6767-4686-9cd4-60788de11f47_0.0.1</a> external__react_.createClass is not a function
    ***CALLSTACK:
    SPError@<a href="https://localhost:4321/temp/workbench-packages/@microsoft_sp-loader/dist/sp-loader-assembly_default.js:8671:24" rel="nofollow noreferrer">https://localhost:4321/temp/workbench-packages/@microsoft_sp-loader/dist/sp-loader-assembly_default.js:8671:24</a>
    SPLoaderError@<a href="https://localhost:4321/temp/workbench-packages/@microsoft_sp-loader/dist/sp-loader-assembly_default.js:4127:21" rel="nofollow noreferrer">https://localhost:4321/temp/workbench-packages/@microsoft_sp-loader/dist/sp-loader-assembly_default.js:4127:21</a>
    <strong>WEBPACK_AMD_DEFINE_RESULT</strong>https://localhost:4321/temp/workbench-packages/@microsoft_sp-loader/dist/sp-loader-assembly_default.js:3786:21
    <strong>WEBPACK_AMD_DEFINE_RESULT</strong>https://localhost:4321/temp/workbench-packages/@microsoft_sp-loader/dist/sp-loader-assembly_default.js:3694:16
    _loadComponentImpl/&lt;@<a href="https://localhost:4321/temp/workbench-packages/@microsoft_sp-loader/dist/sp-loader-assembly_default.js:6939:15" rel="nofollow noreferrer">https://localhost:4321/temp/workbench-packages/@microsoft_sp-loader/dist/sp-loader-assembly_default.js:6939:15</a></p>
  </blockquote>
  
  <p>DocumentUpload.tsx</p>
  
  <pre><code>var App = React.createClass({ getInitialState() {
  return { text: 'Enter Rich Text Description' }; },
  
  render() {
  var divStyle = {
    background: "#eee",
    padding: "10px",
    margin: "1px",
    width: "100%",
    height: "140px",
  };
  
  return (
    &lt;div style={divStyle}&gt;
      &lt;Editor
        text={this.state.text}
        onChange={this.props.handleChange}
      /&gt;
    &lt;/div&gt;
  ); },handleChange(text, medium) { this.setState({ text: text }); } });
  </code></pre>
  
  <p>IDocumentUploadProps.ts</p>
  
  <pre><code>import { SPHttpClient } from '@microsoft/sp-http';
  export interface IDocumentUploadProps {
    spHttpClient: SPHttpClient;
    description: string;
    ProjectName: string;
    ProjectsArray: Array&lt;string&gt;[];
    siteurl: string;
    Building: string;
    Floor: string;
    GridLine: string;
    Subject: string;
    SubContractor: string;
    CreatedDate: string;
    RequiredDate: string;
    Disciplined: string;
    Description: string;
    Requirement: string;
    Comments: string;
    ItemGuid:string;
    loading: boolean;
    UploadedFilesArray: Array&lt;string&gt;[];
    CurrentUser: string;
    UserGroup: string;
    IRFINumber: string;
    IRFISeriesId: string;
    IRFIReference: string; }
  </code></pre>
  
  <p>SPFX version: 1.7.1
  node version: 8.15.0
  npm version: 6.4.1</p>