richiedono non è definito

Im costruzione di un nuovo Reagire app, ma ottengo il seguente errore - "richiedono non è definito"richiedono non è definito

ciao-world.html

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="UTF-8" /> 
    <title>Hello React!</title> 
    <script src="react/react.js"></script> 
    <script src="react/react-dom.js"></script> 

    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script> 
    </head> 
    <body> 
    <div id="example"></div> 
    <script type="text/babel" src="hello-world.js"> 
    </body> 
</html>

Hello-world.js

import React from 'react'; 
import ReactDOM from 'react-dom'; 

import App from './App.jsx'; 

ReactDOM.render(
     <App />, 
     document.getElementById('example') 
    );

App.jsx

import React from 'react'; 

class App extends React.Component { 
    render() { 
     return (
     <div> 
      Hello World!!! 
     </div> 
    ); 
    } 
} 

export default App;

Im che esegue questo dal mio client e non ha alcun server web in esecuzione.

Ho provato a includere http://requirejs.org/docs/release/2.2.0/minified/require.js ma dà un errore completamente diverso.

fonte

2016-04-18 user1050619

Si sta tentando di utilizzare un modulo CommonJS dal proprio browser. Questo sarà non lavoro.

Come li stai utilizzando? Quando si scrive import ... from ... in ES6 Babel traspone queste chiamate a una definizione di modulo denominata CommonJS e poiché CommonJS non è presente nel browser, si otterrà un errore indefinito da require().

Inoltre, stai anche provando a caricare RequireJS che utilizza un modello di definizione di modulo diverso chiamato AMD, Asynchronous Module Definition e non si prenderà cura delle chiamate require per te. È possibile wrap them in chiamate specifiche RequireJS.

Se si desidera utilizzare i moduli CommonJS nella base di codici, è necessario innanzitutto raggrupparli con Browserify o webpack. I due strumenti trasformeranno le tue chiamate require in alcune magie di colla che è possibile utilizzare all'interno del browser.

Ma nel caso specifico, se si rimuovono le chiamate import e si lascia semplicemente occupare il browser e allega le classi create sull'oggetto window, il codice dovrebbe funzionare.

fonte

2016-04-18 15:52:13

risposta

Problemi correlati