ブラウザからReact 16とBabel 6を返す

-1

browserify/webpackでバンドルを作成せずにReactをブラウザから使用したいと思います。私はbabel-standaloneを使用してブラウザから反応するようにしようとしているブラウザからReact 16とBabel 6を返す

は、私は私が持っていたいくつかのコードを変更したが、私はReactDOMがプラス、他の2つの警告（プロセスが定義されていない）私はしました

が定義されていません取得します反応し、domを反応する参照が見つかりました。 cjsのバージョンを含めるのは正しいですか？ cjsは何を表していますか？

私が使用しているコードは次のとおりです。私はCJSはCommonJSを参照していると信じてReactDOM.render

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.2.0/cjs/react.development.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/cjs/react-dom.development.js"></script> 
 
\t <script src="https://unpkg.com/[email protected]/babel.min.js"></script> 
 
    </head> 
 

 
<div id="output"></div> 
 
<script type="text/babel"> 
 

 
ReactDOM.render(
 
    <h1>Hello World</h1>, 
 
    document.querySelector('output') 
 
); 
 

 
</script> 
 

 
</html>

出典

2017-12-27 cdarwin

もともとあなたのCJSの質問に答えないことについて申し訳ありません：

はこれを試してみてください。私はCommonJSを指していると信じています。単純なHTMLテンプレートを使用しているだけなので、代わりに単純な古いJavaScriptバンドルを使用できます。 –

を使用したいと思います。単純なHTMLテンプレートを使用しているので、代わりにプレーンJavaScriptバンドルを含めることができます。

公式のReactのドキュメントから、このminimal HTML templateに従ってスクリプトタグを変更しました。

document.querySelector('output')もdocument.getElementById('output')に変更されました。

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <script src="https://unpkg.com/[email protected]/umd/react.development.js"></script> 
 
    <script src="https://unpkg.com/[email protected]/umd/react-dom.development.js"></script> 
 
    <script src="https://unpkg.com/[email protected]/babel.min.js"></script> 
 
    </head> 
 

 
    <body> 
 
    <div id="output"></div> 
 
    <script type="text/babel"> 
 
     ReactDOM.render(
 
     <h1>Hello World</h1>, 
 
     document.getElementById('output') 
 
    ); 
 
    </script> 
 
    </body> 
 
</html>

出典

2017-12-27 22:18:05

ありがとうございます。 cloudflareとunpkg.comの違いは何ですか？ – cdarwin

両方ともCDNです。私はcloudflareを見て、私はCJSやUMDではなかったJavaScriptバンドルを見つけることができませんでした。 Reactの公式文書はunpkg.comを使用しているので、私はそれを同じにしておきました。 –

ブラウザからReact 16とBabel 6を返す

答えて

関連する問題