JSON - Blender & ThreeJS - Unexpected token < in JSON at position 0 - json

Question

I have exported a 3D model from Blender using the io_three addon.
Now I am trying to load this model into ThreeJS using code like this.
import React, { Component } from 'react';
import * as THREE from 'three';
var loader = new THREE.JSONLoader();
loader.load('./making_a_face10.json', handle_load);
I am consistently getting the same error message.
Unexpected token < in JSON at position 0
I have tried using the THREE.ObjectLoader() and also this option https://github.com/tweedegolf/parsed-model, but it keeps saying error in position 0 of JSON.
As a side note, I can access the JSON like this:
var JSONdata = require('./making_a_face10.json');
That does expose data inside the JSON, but I want the ThreeJS loader to work.
Then I found this example https://threejs.org/examples/#webgl_loader_json_blender and when I went to view the source code it shows that the 'model' is being imported as a .js file??, i.e. they are loading it like this:
loader.load( 'models/animated/monster/monster.js', function ( geometry, materials )...
There is ample material to explain what I want to do but none of it points to loading the model as a .js file.
two more notes - the format of my JSON file looks extremely like this https://github.com/mrdoob/three.js/blob/master/examples/models/animated/monster/monster.js and I am running a local server using npm start
If any whiz kid could help me out I would be extremely grateful.
SOLVED
In the React project folder. The .JSON file was in my /src folder. It should have been in my /public folder.

Answer 1

As Kryten mentioned in the comments.. Your load is failing. The first character in your JSON file is not a '<'. That looks like an XML response failure header.
The THREE loader uses XMLHTTPRequest internally... you could try loading your JSON directly with XMLHTTPRequest and then log the output to see what the error is..