Unexpected token < in JSON at position 0 at JSON.parse

[linjinxuan]

it shows "Unexpected token < in JSON at position 0 at JSON.parse", but i dont konw why

[madwill]

That just means you are not finding the config.json object in the load example and use a router based app which returns an html page. Perhaps you use create-react app ?

[rlaurente]

any solution on this error ? I'm also experiencing this problem. It just randomly occur

Thanks

[ivanthemeh]

Anyone ever figure out a way around this?

[naimkhalifa]

I'm interested too if you figure it out!

[naimkhalifa]

Ok. it's an easy one.

Here's how I solved it on my react app App.js component:

import particlesJS from 'particles.js';
...

class App extends Component {
componentDidMount() {
    window.particlesJS.load('particles-js', '/assets/particles.json', null);
  }

...
}

where /assets/particles.json is a in the public path of your app.

[madwill]

Yes, basically make sure the particle.json file is actually reachable through the path you are requesting it and it will work.

The error comes from the JSON decoder which does not expect an HTML page (which is returned by your router as 404 or default page if you didn't set your particle.json file or path correctly.

Put them in your public folder, type the address in the bar to make sure it loads and you'll be good to go !

[gatzjames]

It is not stated in the docs but if you check the code particlesJS is a function itself

particleJS(tagId, optionsObject)

that you can use instead of the particleJS.load method which loads a config from a JSON file.

[vdfor]

import 'particles.js';
import { option as particleOption } from './particles';
...
componentDidMount() {
    // if ts -- (window as any).particlesJS('particles-js', particleOption, () => {});
    window.particlesJS('particles-js', particleOption, () => {});
  }

render() {
    return (
      <div id="particles-js" />
    );
}
...

[1207915357]

this is useful to me

particlesJS('particles-js', particleOption)

is not the

particlesJS.load('particles-js', particleOption)