React JS Uncaught ReferenceError : require is not defined

Question

I'm currently trying to get React to work by CDN.

When I run the index.html file manually it works. But when I put my files onto a web server like XAMPP, I get hit with

Uncaught ReferenceError : require is not defined

index.html:

<html>
    <head>
        <title>TestApp</title>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.2.0/umd/react.production.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/umd/react-dom.production.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.26.0/babel.min.js"></script>
        <script src="./node_modules/moment/moment.js"></script>
    </head>
    <body>
        <div id="app"></div>
        <script type="text/babel" src="./react.js"></script>
    </body>
</html>

react.js:

const Aest = ({test}) =>  {
    return (
        <div>WATss {test}</div>
    )
}
class Test extends React.Component{
    constructor(){
        super()
        this.state={
            test: 0
        }
    }
    inc(){
        this.setState({
            test: ++this.state.test
        })
    }
    render(){
        return(
            <React.Fragment>
                <div>test: {this.state.test}</div>
                <button onClick={()=>this.inc()}>Add</button>
                <Aest test={this.state.test}/>
            </React.Fragment>
        )
    }
}
ReactDOM.render(<Test />,document.getElementById('app'));

Are you using webpack and babel to bundle/transform your js/jsx? — bntzio
– bntzio, Commented Jan 24, 2018 at 2:49

Sujit.Warrier · Accepted Answer · 2018-01-24 05:02:21Z

2

require is not understood by default in some web severs, to allow it to be recognized first. use require js. npm install it. and import it.

edited Jan 24, 2018 at 5:02

answered Jan 24, 2018 at 3:19

Sujit.Warrier

2,8992 gold badges31 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

React JS Uncaught ReferenceError : require is not defined

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related