1

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. enter image description here

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: enter image description here

Example given in a single js: enter image description here

The example refactored is not being well minified, and imports/exports are replaced by requires: enter image description here

Thank you for reading me!

Yone
  • 2,064
  • 5
  • 25
  • 56

0 Answers0