Home » Javascript » How to add react on a single html page

How to add react on a single html page

Posted by: admin August 19, 2018 Leave a comment

Questions:

I have create a simple application in react and i want to use it in my sepreate project. so i have generate a build of react application using.

npm run build

The build is generated successfully and during build i have copied the main.js file into newly created domain something like

http://reactbuild.localhost.com/public/build/main.js

In my html page i have include the react library for using react in single page.

<div id="root"></div>
<script crossorigin src="https://unpkg.com/[email protected]/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/[email protected]/umd/react-dom.development.js"></script>
<script crossorigin src="https://unpkg.com/[email protected]/babel.min.js"></script>
<script type="text/javascript" src="http://reactbuild.localhost.com/public/build/main.js"></script>

After adding the script in html file everything works fine but in console sometime it will not load the data and show some error (A bad HTTP response code (404) was received when fetching the script) because in react i’m hitting some url and one error is always occur which is

Error during service worker registration: DOMException: Only secure origins are allowed.

so can u please help me what is the problem in my code and do i need to start the react app using

npm start

Because currently i’m accessing it using subdomain. so what the correct way of using react lib in single page app.

Answers: