I'm working on a project, which has already a webserver. The webserver runs PHP and it is limited. Many software cannot be installed.
I understand that React does not require any installation but adding JSX to a project needs to run these commands:
Step 1: Run npm init -y
Step 2: Run npm install babel-cli@6 babel-preset-react-app@3
Unfortunately, I cannot add NodeJS to the webserver.
JSX coding syntax would be very useful for me using the JavaScript files.
Option for adding it to HTML
I understand that I could add JSX to an HTML file:
<script type="text/babel"> ReactDOM.render( <h1>Hello, world!</h1>, document.getElementById('root') ); </script> But I would like to use in .js files.
Examples
I have 2 examples:
- Example is working but it has no JSX.
- Example has JSX but it is not working.
The HTML file is the same.
1. Example project: Unexpected token error with JSX
const myelement1 = <h1>JSX should work</h1>; ReactDOM.render( myelement1, document.getElementById('reactRoot') );<!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title></title> </head> <body> <h1>My React example page</h1> <div id="reactRoot"></div> <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://unpkg.com/babel-standalone@6/babel.min.js"></script> </body> </html>2. Example project: React is working without JSX
const myelement2=React.createElement('h1', {} , 'No JSX!'); ReactDOM.render( myelement2, document.getElementById('reactRoot'));<!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title></title> </head> <body> <h1>My React example page</h1> <div id="reactRoot"></div> <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://unpkg.com/babel-standalone@6/babel.min.js"></script> </body> </html>My Question
How could I fix 1. Example project, if no program installation is possible?
https://stackoverflow.com/questions/66837566/can-i-use-react-and-jsx-in-javascript-without-installing-the-node-js March 28, 2021 at 09:04AM
没有评论:
发表评论