three-nebula icon indicating copy to clipboard operation
three-nebula copied to clipboard

Error when using module setup - why is this so hard to implement :(

Open samyH opened this issue 2 years ago • 3 comments

This is the error I get when following the docs for module implementation.

index.js:13 Uncaught ReferenceError: SpriteRenderer is not defined at require.2../loader (index.js:13:1) at newRequire (index.js:13:1) at index.js:13:1 at index.js:13:1

index.js

`import { intro } from './loader'; import './styles/main.scss' import System, { Emitter, Rate, Span, Position, Mass, Radius, Life, Velocity, PointZone, Vector3D, Alpha, Scale, Color } from 'three-nebula'; // import { THREE } from 'three' import * as THREE from 'three';

intro();

const threeScene = new THREE.Scene(); const system = new System(); const emitter = new Emitter(); const renderer = new SpriteRenderer(threeScene, THREE);

// Set emitter rate (particles per second) as well as the particle initializers and behaviours emitter .setRate(new Rate(new Span(4, 16), new Span(0.01))) .setInitializers([ new Position(new PointZone(0, 0)), new Mass(1), new Radius(6, 12), new Life(3), new RadialVelocity(45, new Vector3D(0, 1, 0), 180), ]) .setBehaviours([ new Alpha(1, 0), new Scale(0.1, 1.3), new Color(new THREE.Color(), new THREE.Color()), ]);

// add the emitter and a renderer to your particle system system .addEmitter(emitter) .addRenderer(renderer) .emit({ onStart, onUpdate, onEnd });`

not much in there

samyH avatar Jun 24 '22 11:06 samyH

Also trying this way:

You can also instantiate your system from a JSON object

I get

index.js:13 Uncaught TypeError: _threeNebula2.default.fromJSONAsync is not a constructor at require.2../loader (index.js:13:1) at newRequire (index.js:13:1) at index.js:13:1 at index.js:13:1

samyH avatar Jun 24 '22 11:06 samyH

Hi, have you tried looking at the codesandbox quick start example?

rohan-deshpande avatar Aug 07 '22 09:08 rohan-deshpande

Hey @rohan-deshpande,

I managed to get something running using the quick start example a few months back, I'm now trying to make something new and after downloading the quick start example and running npm i I get npm ERR! unable to resolve dependency tree.

I added --force as suggested and when running via live server I get:

Uncaught SyntaxError: Cannot use import statement outside a module (at index.js:1:1)

So added type="module" to index.js, then get other issues:

Uncaught TypeError: Failed to resolve module specifier "reset-css". Relative references must start with either "/", "./", or "../".

Any idea how to get this setup working again?

samyH avatar Sep 27 '22 12:09 samyH