vuejs / eslint-plugin-vue

Official ESLint plugin for Vue.js
https://eslint.vuejs.org/
MIT License
4.46k stars 666 forks source link

Error message in vuejs: JSON parsing error detected due to an unexpected "<" symbol at the beginning #2536

Closed jsV8 closed 2 months ago

jsV8 commented 2 months ago

I have been trying to troubleshoot this issue, but I am having trouble understanding how to resolve it.

Currently, I am using lottie-web in a project and need to set the animation parameters on an object in order to pass them as a parameter later.

This is part of my component:

import Lottie from './../../node_modules/lottie-web/build/player/lottie';

export default {
  name: 'Illustration',
  mounted() {
    this.animationParams = {
      container: document.getElementById('animation'),
      renderer: 'svg',
      loop: 'true',
      autoplay: 'false',
      path: '/src/data/animation.json',
    };
    Lottie.loadAnimation(this.animationParams);
  },
  data() {
    return {
      animationParams: {
      },
    };
  },

However, when I run this line:

Lottie.loadAnimation(this.animationParams);

I encounter the following error:

Uncaught SyntaxError: Unexpected token < in JSON at position 0
at JSON.parse (<anonymous>)
at XMLHttpRequest.xhr.onreadystatechange

Based on other responses on Stack Overflow, it seems that I should not need to parse the JSON file since it is already parsed. However, I am unsure how to handle it without parsing.

The content of the JSON file can be found here: .

How can I load this JSON file without parsing it?

By https://javascripter.space/questions/error-message-in-vuejs-json-parsing-error-detected-due-to-an-unexpected-lt-symbol-at-the-beginning

FloEdelmann commented 2 months ago

This has nothing to with Vue.js, please ask at StackOverflow or similar sites.