Hello and thank you for your time to read this question!
I am trying to deploy to GitHub pages, and currently I am using Node and WebPack.
I do not know why it says:
ReferenceError: require is not defined
When I try to navigate to the page that I have just deployed.
The line being affected is:
import setCamera from './camera';
I have read that require() is not an implemented function in client browsers: Client on node: Uncaught ReferenceError: require is not defined
So then I have tried to bundle and minify the JS files, however something I can not explain happens.
The pages where I have only one js are correctly minified and the file is called: fileName.js
and spaces are deleted and variables are uglified.
However in the page I am doing which I have separated into different js files, those are being bundled with requires such as:
var _cameras = require('base/cameras/cameras.orthographic');
Is there any way to be able to write different JS files and deploy it in a way that the browser could read it,I mean without using require?
The reason why I am confused is because in local with the Node server it works well, however in the remote GitHub pages it does not.
Image which shows the error. When I go to the page's section where is the example that I have refactored usign different js files, loading them via import/export syntax.
Here I show you how the single js file example provided by the source repo, called viewers_quadview is well minified, however the example refactored with different js files uses require:
The example refactored is not being well minified, and imports/exports are replaced by requires:
Thank you for reading me!