ESLint पार्सिंग त्रुटि: अप्रत्याशित टोकन

Question

इस कोड के साथ:

import React from 'react';
import { Link } from 'react-router';
import { View, NavBar } from 'amazeui-touch';

import * as Pages from '../components';

const {  Home, ...Components } = Pages;

मुझे यह अनुगामी त्रुटि मिली:

7:16  error  Parsing error: Unexpected token .. Why?

यहाँ मेरा एस्लिंट विन्यास है:

{
  "extends": "airbnb",
  "rules": {
    /* JSX */
    "react/prop-types": [1, {
      "ignore": ["className", "children", "location", "params", "location*"]
    }],
    "no-param-reassign": [0, {
      "props": false
    }],
    "prefer-rest-params": 1,
    "arrow-body-style": 0,
    "prefer-template": 0,
    "react/prefer-stateless-function": 1,
    "react/jsx-no-bind": [0, {
      "ignoreRefs": false,
      "allowArrowFunctions": false,
      "allowBind": true
    }],
  }
}

.... .... समस्या क्या है?

Comments

क्या आप अपना अनुलग्‍नक पोस्ट कर सकते हैं?

— अज़ीम

धन्यवाद मैं पहले ही अपलोड कर चुका हूँ ~

— डोंगायो

आपको एक पार्सर का उपयोग करने की आवश्यकता है जो ऑब्जेक्ट प्रसार संपत्ति के प्रस्ताव का समर्थन करता है।

— फेलिक्स क्लिंग

अप्रत्याशित टोकन "आयात"? यह मेरा मुद्दा था ।

— लोनी बेस्ट

Answer 1

ESLint पार्सिंग में अनपेक्षित टोकन त्रुटियां आपके विकास के माहौल के बीच असंगति के कारण होती हैं और JavaScripts ES6 ~ 7 के साथ चल रहे परिवर्तनों के साथ ESLint की वर्तमान पार्सिंग क्षमताएं।

अपने .eslintrc में "parserOptions" गुण जोड़ना अब विशेष स्थितियों के लिए पर्याप्त नहीं है, जैसे कि उपयोग करना

static contextTypes = { ... } /* react */

ES6 क्लासेस में ESLint के रूप में वर्तमान में इसे अपने आप से पार्स करने में असमर्थ है। इस विशेष स्थिति में त्रुटि आएगी:

error Parsing error: Unexpected token =

समाधान के लिए ESLint को एक संगत पार्सर द्वारा पार्स किया गया है। बैबल-एस्लिंट एक पैकेज है जिसने मुझे इस पृष्ठ को पढ़ने के बाद हाल ही में बचाया और मैंने बाद में आने वाले किसी भी व्यक्ति के लिए वैकल्पिक समाधान के रूप में इसे जोड़ने का फैसला किया।

बस जोड़ दो:

"parser": "babel-eslint"

अपनी .eslintrcफ़ाइल में और चलाएं npm install babel-eslint --save-devया yarn add -D babel-eslint।

कृपया ध्यान दें कि चूंकि नए संदर्भ API की शुरुआत React ^16.3कुछ महत्वपूर्ण बदलावों से हुई है, कृपया आधिकारिक गाइड देखें ।

Comments

yarn add -D babel-eslintयार्न का उपयोग करने वालों के लिए।

— न्यूरोट्रांसमीटर

उन लोगों के लिए जो "parser": "babel-eslint"कॉन्फ़िगरेशन स्टेटमेंट को जोड़ना नहीं जानते हैं , यह अंदर है .eslintrc.json। मेरे मामले में, यह एक JSON फाइल है, लेकिन मूल रूप से, आपकी .eslintrc फ़ाइल

— AVID प्रोग्रामर

नोट * यदि आपने अपना क्रिएट-रिएक्शन-ऐप "ई-बेक्ड" कर लिया है और आप अपने आईडीई में एस्लिंट-आईएनजी जोड़ रहे हैं, तो बेबल-एस्लिंट पहले से ही लागू है। बस पार्सर जोड़ें और जाने के लिए आपका अच्छा।

— वेस डफ

: मैं भी इस लेख उपयोगी पाया grantnorwood.com/...

— gurun8

मैंने "parser": "babel-eslint"अपनी eslintrc फ़ाइल में जोड़ा, लेकिन इसके बजाय कई त्रुटियां मिलीं। मैं प्रतिक्रिया के साथ काम कर रहा हूं और यह मुझे बताता है कि मेरे आयातित घटकों को बुलाया गया था लेकिन कभी उपयोग नहीं किया गया। जो अजीब है।

— डेविड एसेन

Answer 2

ESLint 2.x प्रयोगात्मक रूप से ObjectRestSpread सिंटैक्स का समर्थन करता है, आप इसे अपने .eslintrc: डॉक्स में निम्न जोड़कर सक्षम कर सकते हैं

"parserOptions": {
  "ecmaVersion": 6,
  "ecmaFeatures": {
    "experimentalObjectRestSpread": true
  }
},

ESLint 1.x मूल रूप से स्प्रेड ऑपरेटर का समर्थन नहीं करता है, इसके आस -पास पहुंचने का एक तरीका बैबल-एस्लिंट पार्सर का उपयोग करना है । नवीनतम इंस्टॉलेशन और उपयोग निर्देश प्रोजेक्ट रीडमे पर हैं।

Comments

यह सच नहीं है। ESLint का डिफ़ॉल्ट पार्सर एस्प्री स्प्रेड का समर्थन करता है, और यहां तक ​​कि ऑब्जेक्ट बाकी स्प्रेड भी फैलता है (यह एकमात्र प्रयोगात्मक विशेषता है जो एस्प्री सपोर्ट करता है)। अधिक जानकारी के लिए इसे देखें: eslint.org/docs/user-guide/…

— Ilya Volodin

ecmaFeaturesपदावनत कर दिया गया है। उपयोगecmaVersion

— रिचर्ड अयोटे

ecmaVersion: 2018ESLint 5 के साथ एक चेतावनी के बिना काम करता है

— टॉमाज़ राशिया

सबसे अच्छा समाधान अगर मैं ऐसा कह सकता हूं।

— Ansjovis86 15

मुझे इस समाधान के साथ कोई समस्या नहीं दिख रही है - यह मेरे लिए ठीक है। यह एक नया पैकेज स्थापित करने से बेहतर है!

— स्टीम गेमर

Answer 3

"parser": "babel-eslint" इस मुद्दे को ठीक करने में मेरी मदद की

{
    "parser": "babel-eslint",
    "parserOptions": {
        "ecmaVersion": 6,
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true,
            "modules": true,
            "experimentalObjectRestSpread": true
        }
    },
    "plugins": [
        "react"
    ],
    "extends": ["eslint:recommended", "plugin:react/recommended"],
    "rules": {
        "comma-dangle": 0,
        "react/jsx-uses-vars": 1,
        "react/display-name": 1,
        "no-unused-vars": "warn",
        "no-console": 1,
        "no-unexpected-multiline": "warn"
    },
    "settings": {
        "react": {
            "pragma": "React",
            "version": "15.6.1"
        }
    }
}

संदर्भ

Comments

यह उत्तर @ JaysQubeXon ​​के उत्तर में कुछ भी नहीं जोड़ता है।

— cs01

वास्तव में यह होता है - आपको एक उदाहरण विन्यास मिलता है (जिसमें पार्सर शामिल हैं)

— kriskodzi

पूर्ण उदाहरण के लिए महान है ++। इसने मुझे एक टेम्परमॉन्की जेएस संकेत त्रुटि को ठीक करने में मदद की।

— ब्रासोफिलो

@brasofilo आप छेड़छाड़ बंदर में एस्लिन्ट कहां बदलते हैं?

— Metin Dagcilar

Answer 4

मैंने पहले इस मुद्दे को हल किया, एनपीएल का उपयोग करके बैबेल-एस्लिंट स्थापित करना

npm install babel-eslint --save-dev

दूसरे, इस कॉन्फ़िगरेशन को .eslintrc फ़ाइल में जोड़ें

{
   "parser":"babel-eslint"
}

Comments

धन्यवाद, इसने मेरे

— लाइनिंग

Answer 5

मेरे मामले में (फायरबेस क्लाउड फ़ंक्शंस का उपयोग करके im) मैंने खोला .eslintrc.jsonऔर बदल दिया:

"parserOptions": {
  // Required for certain syntax usages
  "ecmaVersion": 2017
},

सेवा:

"parserOptions": {
  // Required for certain syntax usages
  "ecmaVersion": 2018
},

Answer 6

मूल रूप से, समाधान निम्नलिखित विन्यास प्रदान करने के लिए था क्योंकि ऑब्जेक्ट विनाशकारी एक प्रयोगात्मक सुविधा के रूप में उपयोग किया जाता है और डिफ़ॉल्ट रूप से समर्थित नहीं है:

{
  "parserOptions": {
    "ecmaFeatures": {
      "experimentalObjectRestSpread": true
    }
  }
}

संस्करण 5 के बाद से, इस विकल्प को हटा दिया गया है ।

अब यह केवल ES के एक संस्करण की घोषणा करने के लिए पर्याप्त है, जो नया पर्याप्त है:

{
  "parserOptions": {
    "ecmaVersion": 2018
  }
}

Answer 7

यदि आपको हस्की चलाने के साथ एक पूर्व-प्रतिबद्ध कार्य मिला है eslint, तो कृपया पढ़ना जारी रखें। मैंने उन अधिकांश उत्तरों के बारे में parserOptionsऔर उन parserमूल्यों के बारे में जानने की कोशिश की जहाँ मेरा वास्तविक मुद्दा नोड संस्करण के बारे में था जिसका मैं उपयोग कर रहा था।

मेरा वर्तमान नोड संस्करण 12.0.0 था, लेकिन हस्की मेरे एनवीएम डिफ़ॉल्ट संस्करण का किसी भी तरह (भले ही nvmमेरे सिस्टम में नहीं था) उपयोग कर रहा था । यह खुद कर्कश के साथ एक मुद्दा लगता है। इसलिए:

1. मैं नष्ट कर दिया $HOME/.nvmफ़ोल्डर जो हटाया नहीं गया था जब मैं हटाया nvmपहले।
2. सत्यापित नोड नवीनतम और उचित पार्सर विकल्प हैं।
3. इसने काम करना शुरू कर दिया!

Answer 8

सिर्फ रिकॉर्ड के लिए, यदि आप एस्लिंट-प्लगइन-व्यू का उपयोग कर रहे हैं, तो जोड़ने 'parser': 'babel-eslint'का सही स्थान parserOptionsपरम के अंदर है ।

  'parserOptions': {
    'parser': 'babel-eslint',
    'ecmaVersion': 2018,
    'sourceType': 'module'
  }

https://eslint.vuejs.org/user-guide/#faq