1

I am trying to include a bunch of React elements I have in file myfile.jsx <script type="text/babel" src="http://example.com/js/r/myfile.jsx"></script> This does not work.
If I try to put import "http://example.com/js/r/myfile.jsx"; it tells me require is not defined.
Is there a simple way, via script tag to include jsx code?
I am using it on the web only, I use Babel to transpile it. Below is my header, code works fine when all is in the same page.

<script src="https://unpkg.com/react@15/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
Itay Moav -Malimovka
  • 52,579
  • 61
  • 190
  • 278

2 Answers2

1

Yes, you have to add type='text/jsx' in the script tag. For example,

<script src="app.jsx" type="text/jsx"></script>
Pang
  • 9,564
  • 146
  • 81
  • 122
Azmi Pankaj Yadav
  • 19
  • 3
0

You have to include type="text/babel", for example:

<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>

<!-- Load your-custom.js React file using type="text/babel" -->
<script type="text/babel" src="./js/your-custom.js"></script>
Ferm12
  • 1
  • 1