Search code examples
javascriptreactjspapaparse

PapaParse Script Path is Undefined


I've been looking all over for a solution to this and I can't figure it out for the life of me...

The sitch: I have a lazy loaded React component which is supposed to parse a CSV file (with PapaParse) which is all built within the create-react-app framework. But for some reason, despite everything saying it should work, when I try to use PapaParse, I get this error:

Error: Script path cannot be determined automatically when Papa Parse is loaded asynchronously. You need to set Papa.SCRIPT_PATH manually.

But since this is bundled with Webpack I have no idea what this script path should be and I've tried setting the path to the PapaParse folder within the project folder structure (i.e. something like ../../node_modules/papaparse) to no avail. I actually got a different error when I put in a path:

papaparse?papaworker:1 Uncaught SyntaxError: Unexpected token <

For some more context, the component in question looks a little like this:

import Papa from 'papaparse';

class Dialog extends React.Component {
    ...
    handleFileChange = () => {
       ...
       Papa.parse(file, config);
       ...
    }
    ...
}

I installed PapaParse via npm, so it should be the latest version, some things go back to 2014-15 where these problems existed, but it's said to have been updated...


Solution

  • Actually, I'm confused, because it works well on both of my projects, hence, React Web App and React Native iOS, Android App.

    I imported it like below:

    import Papa from 'papaparse/papaparse.min';
    

    Surely, for each project, there are some configs that maybe some libraries work badly. but you maybe can use Node.js path for setting SCRIPT_PATH for Papa:

    import path from 'path';
    
    ...
    Papa.SCRIPT_PATH = path.resolve('/node_modules/papaparse');
    ...
    

    Or if it has the issue too, then use this link answer for using papaparse directly in your code. that is not recommended.