admin管理员组

文章数量:1295773

I'm new to react.js and I am trying to get this code to replace one line in an html file inside an electron app with whatever is in return inside the MainInterface variable

This is my Render.js File

var React = require('react');
var ReactDOM = require('react-dom');

var $ = jQuery = require('jquery');
var bootstrap = require('bootstrap');

//var createReactClass = require('create-react-class');

var MainInterface = React.createClass({
  render: function() {
    return(
      <h1>SUCCESSSSSSSSSSS</h1>
  );
}//render
});//MainInterface

ReactDOM.render(
  <MainInterface />,
  document.getElementById('projects')
);//render

This is the html file (looking to replace WPM ... loading) (I do have the last html tag that is missing here in my actual file)

> <!DOCTYPE html> <html lang ="en">   <head>
>     <meta charset="utf-8">
>     <meta name ="viewport" content="width=device-width, initial-scale=1.0">
>     <meta http-equiv="X-UA-Compatible" content="ie=edge">
>     <link rel="stylesheet" href="css/app.css">
>     <title>Project Manager</title>   </head>   <body>   <div claa="main">
>     <div class="page" id="projectratings">
>       <div id="projects">
>         <h2>WPM ... loading</h2>
>       </div>
>     </div>   </div> <script src="js/render.js"></script>   </body>

This is my package.json

{
  "name": "ETest",
  "version": "1.0.0",
  "main": "app/main.js",
  "devDependencies": {
    "create-react-class": "^15.6.2",
    "electron": "^1.7.8",
    "electron-packager": "^9.1.0",
    "gulp": "^3.9.1",
    "gulp-browserify": "^0.5.1",
    "gulp-concat-css": "^2.3.0",
    "gulp-react": "^3.1.0",
    "gulp-run": "^1.7.1",
    "react": "^16.0.0",
    "react-addons-test-utils": "^15.6.2",
    "react-dom": "^16.0.0",
    "reactify": "^1.1.1"
  },
  "dependencies": {
    "bootstrap": "^3.3.7",
    "electron-reload": "^1.2.2",
    "jquery": "^3.2.1",
    "lodash": "^4.17.4"
  }
}

I have tried installing creat-react-class and using that (as seen in the line that is commented out in the render.js file)

I have uninstalled and reinstalled both react and react-dom

not sure what else I am missing

just keep getting 

C:\Users\user\Desktop\ElectronTesting\process\js\fake_6052bf8b.js:8 
Uncaught TypeError: React.createClass is not a function

my render.js file is found at ElectronTesting\process\js\render.js not sure why it points to fake_6052bf8b.js I've been assuming that's some type of temp file (please correct me if I am wrong)

Thanks for any and all help.

**EDIT yep just a simple mistake, forgot to replace React.createClass with createReactClass, thanks for the code example that made me finally see it!!

I'm new to react.js and I am trying to get this code to replace one line in an html file inside an electron app with whatever is in return inside the MainInterface variable

This is my Render.js File

var React = require('react');
var ReactDOM = require('react-dom');

var $ = jQuery = require('jquery');
var bootstrap = require('bootstrap');

//var createReactClass = require('create-react-class');

var MainInterface = React.createClass({
  render: function() {
    return(
      <h1>SUCCESSSSSSSSSSS</h1>
  );
}//render
});//MainInterface

ReactDOM.render(
  <MainInterface />,
  document.getElementById('projects')
);//render

This is the html file (looking to replace WPM ... loading) (I do have the last html tag that is missing here in my actual file)

> <!DOCTYPE html> <html lang ="en">   <head>
>     <meta charset="utf-8">
>     <meta name ="viewport" content="width=device-width, initial-scale=1.0">
>     <meta http-equiv="X-UA-Compatible" content="ie=edge">
>     <link rel="stylesheet" href="css/app.css">
>     <title>Project Manager</title>   </head>   <body>   <div claa="main">
>     <div class="page" id="projectratings">
>       <div id="projects">
>         <h2>WPM ... loading</h2>
>       </div>
>     </div>   </div> <script src="js/render.js"></script>   </body>

This is my package.json

{
  "name": "ETest",
  "version": "1.0.0",
  "main": "app/main.js",
  "devDependencies": {
    "create-react-class": "^15.6.2",
    "electron": "^1.7.8",
    "electron-packager": "^9.1.0",
    "gulp": "^3.9.1",
    "gulp-browserify": "^0.5.1",
    "gulp-concat-css": "^2.3.0",
    "gulp-react": "^3.1.0",
    "gulp-run": "^1.7.1",
    "react": "^16.0.0",
    "react-addons-test-utils": "^15.6.2",
    "react-dom": "^16.0.0",
    "reactify": "^1.1.1"
  },
  "dependencies": {
    "bootstrap": "^3.3.7",
    "electron-reload": "^1.2.2",
    "jquery": "^3.2.1",
    "lodash": "^4.17.4"
  }
}

I have tried installing creat-react-class and using that (as seen in the line that is commented out in the render.js file)

I have uninstalled and reinstalled both react and react-dom

not sure what else I am missing

just keep getting 

C:\Users\user\Desktop\ElectronTesting\process\js\fake_6052bf8b.js:8 
Uncaught TypeError: React.createClass is not a function

my render.js file is found at ElectronTesting\process\js\render.js not sure why it points to fake_6052bf8b.js I've been assuming that's some type of temp file (please correct me if I am wrong)

Thanks for any and all help.

**EDIT yep just a simple mistake, forgot to replace React.createClass with createReactClass, thanks for the code example that made me finally see it!!

  • javascript
  • electron
  • jsx
  • package.json
  • react-dom
Share Improve this question edited Oct 4, 2017 at 2:44 Tavem asked Oct 4, 2017 at 2:17 TavemTavem 431 gold badge1 silver badge4 bronze badges 2
  • What error did you get when you tried to use createReactClass? – TAGraves Commented Oct 4, 2017 at 2:32
  • Is this new code? If so, don't use create-react-class, just write modern JS and extend your component from React's Component class. – Mike 'Pomax' Kamermans Commented Oct 4, 2017 at 2:51
Add a comment  | 

3 Answers 3

Reset to default 22

React removed createClass from version 16. You can use create-react-class to migrate easily as shown in react documentation.

// Before (15.4 and below)
var React = require('react');

var Component = React.createClass({
  mixins: [MixinA],
  render() {
    return <Child />;
  }
});

// After (15.5)
var React = require('react');
var createReactClass = require('create-react-class');

var Component = createReactClass({
  mixins: [MixinA],
  render() {
    return <Child />;
  }
});

read more about this https://reactjs.org/blog/2017/04/07/react-v15.5.0.html#migrating-from-reactcreateclass

export default class App extends React.Component{
    render() {
        return(
           <h1>its works</h1>
        );
    }
};

this works for me, checkout this ReactJs CreateClass is not a function thus its by exports React.component instead of using React.createClass

In the latest version of React, you will notice that React.createClass was removed from the library. One of the biggest changes is that you can create React components using JavaScript classes.

本文标签：

版权声明：本文标题：javascript - &quot;Uncaught TypeError: React.createClass is not a function&quot; in Render.js file (electron app) - Stac 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1738472332a2088661.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。