I have a React app with Vite on which I'm implementing an external JS script.
I load the script on index.html and it works perfectly on development, but when I bundle it for production the script is not loaded.
At first, I received an error that I needed to include type="module" when loading the script and that fixed the error, but when I go to the part of the application that uses that script, I get the error that is not defined.
The script is in /vendors/faceio/fio.js.
<body>
<!-- <script src="https://cdn.faceio.net/fio.js"></script> -->
<script type="module" src="/vendors/faceio/fio.js"></script>
<div id="root"></div>
<script type="module" src="/src/index.jsx"></script>
<script>
const global = globalThis;
</script>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
Can anyone point out how to make this work please.
You can just import it in your main.jsx file.
import "./vendors/faceio/fio.js"
const faceio = new faceIO("fioa414d");
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With