Nodejs5 और कोलाहल में "अप्रत्याशित टोकन आयात"?


192

जेएस फ़ाइल में, मैंने आवश्यकता के बजाय आयात का उपयोग किया

import co from 'co';

और इसे सीधे नोडज द्वारा चलाने की कोशिश की क्योंकि यह कहा गया है कि आयात 'शिपिंग फीचर्स' है और बिना किसी रनटाइम फ्लैग ( https://nodejs.org/en/docs/es6/ ) के बिना समर्थन है , लेकिन मुझे एक त्रुटि मिली

import co from 'co';
^^^^^^

SyntaxError: Unexpected token import

तब मैंने बेबल का इस्तेमाल करने की कोशिश की

npm install -g babel-core
npm install -g babel-cli
npm install babel-core //install to babel locally, is it necessary?

और द्वारा चलाएं

babel-node js.js

अभी भी एक ही त्रुटि मिली, अप्रत्याशित टोकन आयात?

मैं इससे कैसे छुटकारा पा सकता हूं?


14
@FelixKling: हालांकि जुड़े हुए प्रश्न का उत्तर निश्चित रूप से इस प्रश्न का उत्तर देता है, लेकिन इस प्रश्न को उस डुप्लिकेट के रूप में देखना मुश्किल है। किसी भी मामले में, मुझे यहाँ यह जानकर खुशी हुई, क्योंकि Google ने मुझे सीधे यहाँ लाया क्योंकि वर्णित वाक्यविन्यास त्रुटि बिल्कुल वही थी जो मैंने देखी थी। मुझे ईमानदारी से खुशी है कि ओपी ने इसे पोस्ट करने के बजाय कुछ हद तक संबंधित सवाल के जवाब के लिए खोजा जो फिट हुआ।
स्कॉट सॉइयट

3
npm i --save-dev babel-cli यह मेरे लिए तय ...
चुक्हार्डी

2
मैं इसे एक डुप्लिकेट के रूप में चिह्नित करने के लिए वोट देता हूं, मुझे लगता है कि यह एक अलग सवाल है।
TWR कोल

3
यह कोई डुप्लिकेट नहीं है। एक अन्य समाधान मैं पद चाहते हैं दोहरी जांच आप इस प्लगइन में है .babelrc: "transform-es2015-modules-commonjs"
डैन डस्केल्सस्कु

7
डुप्लिकेट हैं (होना चाहिए) ठीक है। यह मनुष्य के काम करने का एक महत्वपूर्ण हिस्सा है। @ScottSauyet का कहना है कि इसका एक कारण है। विभिन्न दृष्टिकोणों के साथ विभिन्न स्पष्टीकरण एक और है। यह पूरा 'डुप्लीकेट हंट' मुझे बरसों से एक रेग्युलर विजिटर के रूप में बहुत अनहेल्दी लगता है। काश यह रुक जाता।
स्टिजन डी विट

जवाबों:


202

बेबल से 6 रिलीज नोट:

चूंकि बैबल जावास्क्रिप्ट टूलींग के लिए एक मंच होने पर ध्यान केंद्रित कर रहा है न कि ES2015 ट्रांसपॉइलर पर, हमने सभी प्लगइन्स को ऑप्ट-इन बनाने का निर्णय लिया है। इसका मतलब है कि जब आप बैबेल को इंस्टॉल करते हैं तो यह आपके ES2015 कोड को डिफ़ॉल्ट रूप से ट्रांसपाइल नहीं करेगा।

अपने सेटअप में मैंने es2015 प्रीसेट स्थापित किया

npm install --save-dev babel-preset-es2015

या यार्न के साथ

yarn add babel-preset-es2015 --dev

और मेरे .babelrc में पूर्व निर्धारित को सक्षम किया

{
  "presets": ["es2015"]
}

14
अच्छा उत्तर। दुर्भाग्य से, आपको अभी भी आवश्यकता () का उपयोग करने की आवश्यकता है और npm संकुल के लिए आयात का उपयोग नहीं कर सकते।
जगदीश चड्ढा

24
मैं babel-nodeसाथ es2015और reactप्रीसेट का उपयोग करता हूं । वही त्रुटि।
फजी

3
काम नहीं किया। हाँ, जिसकी आवश्यकता है, लेकिन यह आयात कार्य नहीं करता है।
still_dreaming_1 17

6
मेरे लिए यह एक साधारण फिक्स था। मैं सुरंग दृष्टि में एक es5 परियोजना में एक प्रतिक्रिया / कोलाहल परियोजना से कोड को अनुकूलित करने और एक ही समय में es6 सिंटैक्स में अपग्रेड करने की कोशिश में पकड़ा गया था। स्क्रिप्ट के तहत मेरे package.json में, मैं "babel-node run.js" के साथ "नोड रन" को बदलना भूल गया। हाँ, मैं भेड़चाल महसूस करता हूँ। :)
जोजेन777

2
जेएस इकोसिस्टम इतना आसान है
रोड्रिगो

51

मॉड्यूल लागू होने तक आप अपने कोड को चलाने के लिए बैबिल "ट्रांसपिलर" का उपयोग कर सकते हैं:

npm install --save babel-cli babel-preset-node6

और फिर

./node_modules/babel-cli/bin/babel-node.js --presets node6 ./your_script.js

यदि आप टाइप नहीं करना चाहते हैं तो आप --presets node6इसे सहेज सकते हैं।

{
  "presets": [
    "node6"
  ]
}

देखें https://www.npmjs.com/package/babel-preset-node6 और https://babeljs.io/docs/usage/cli/


16
बेबल लोगों से नवीनतम सिफारिश को बैबेल-प्रीसेट-एनवी का उपयोग करना है जो पता लगाता है कि पॉलीफ़िल को चलाने के लिए, बजाय babel-preset-node*। में .babelrcउपयोग:{ "presets": [ ["env", { "targets": { "node": "current" } }] ] }
रोनेन

इसके बाद मुझे त्रुटि मिलने लगी (गैर-मान्यता प्राप्त टोकन '<'): server.js:Unexpected token (37:12) 35 | const initialState = store.getState(); 36 | const componentHTML = renderToString( > 37 | <Provider store={store}> | ^ 38 | <RouterContext {...props} /> 39 | </Provider>, 40 | );
AK

26
  1. संकुल स्थापित करें: babel-core, babel-polyfill,babel-preset-es2015
  2. .babelrcसामग्री के साथ बनाएँ :{ "presets": ["es2015"] }
  3. importअपनी मुख्य प्रविष्टि फ़ाइल में स्टेटमेंट न डालें , दूसरी फाइल का उपयोग करें जैसे: app.jsऔर आपकी मुख्य प्रविष्टि फ़ाइल की आवश्यकता होनी चाहिए babel-core/registerऔर babel-polyfillकिसी भी चीज़ से पहले पहले स्थान पर अलग से काम करना चाहिए । तो फिर आप की आवश्यकता कर सकते हैं app.jsजहां importबयान।

उदाहरण:

index.js

require('babel-core/register');
require('babel-polyfill');
require('./app');

app.js

import co from 'co';

इसके साथ काम करना चाहिए node index.js


1
यह एक आसान समाधान है जिसका उपयोग विकास के लिए किया जा सकता है। हालांकि उत्पादन के लिए आपको हमेशा अपने es5 कोड को संकलित करना चाहिए।
जोनास ड्रोटलफ

रुको ... क्या यह मुझे लगता है कि यह है? कुछ महीने पहले मेरा यह सपना था कि जावास्क्रिप्ट / पर्ल / किसी भी भाषा को उसी भाषा में मौजूदा भाषा के कस्टम अतिरिक्त पार्सिंग द्वारा अपडेट के बिना बढ़ाया जा सकता है। क्या यहाँ चल रहा है ???
दिमित्री

बहुत बढ़िया जवाब। लेकिन स्क्रिप्ट में, आप नीचे की तरह कुछ डाल सकते हैं। तो आप किसी भी फाइल में उपयोग कर सकते हैं। "स्क्रिप्ट": {"बिल्ड": "बेबल src -d डिस्ट", "स्टार्ट": "नोड डिस्ट /
इंडेक्स.जेएस

15

babel-preset-es2015 अब पदावनत कर दिया जाता है और यदि आप लारेंस के समाधान का उपयोग करने का प्रयास करते हैं तो आपको चेतावनी मिल जाएगी।

इसे बाबेल 6.24.1+ के साथ काम करने के लिए, babel-preset-envइसके बजाय उपयोग करें :

npm install babel-preset-env --save-dev

फिर envअपने प्रीसेट को अपने में जोड़ें .babelrc:

{
  "presets": ["env"]
}

अधिक जानकारी के लिए बैबल डॉक्स देखें ।


क्या सीएलआई के साथ ऐसा करने का कोई तरीका है?
२०:०२ पर jcollum

6

यदि आप प्रीसेट का उपयोग प्रतिक्रिया-मूल के लिए करते हैं तो यह आयात को स्वीकार करता है

npm i babel-preset-react-native --save-dev

और इसे अपने .babelrc फ़ाइल के अंदर रखें

{
  "presets": ["react-native"]
}

अपनी परियोजना रूट निर्देशिका में

https://www.npmjs.com/package/babel-preset-react-native


5

यह हो सकता है कि आप अनलेडेड फ़ाइलों को चला रहे हों। चलो साफ शुरू करो!

अपने कार्य निर्देशिका में बनाएँ:

  • दो फोल्डर। एक precompiled es2015 कोड के लिए। बाबेल के आउटपुट के लिए अन्य। हम उन्हें क्रमशः "src" और "lib" नाम देंगे।
  • निम्नलिखित ऑब्जेक्ट के साथ एक पैकेज.जॉन फ़ाइल:

    { 
      "scripts": {
          "transpile-es2015": "babel src -d lib"
      },
      "devDependencies": {
          "babel-cli": "^6.18.0",
          "babel-preset-latest": "^6.16.0"
      }
    }
  • निम्नलिखित निर्देशों के साथ ".babelrc" नामक एक फ़ाइल: {"presets": ["latest"]}

  • अंत में, अपने src / index.js फ़ाइल में परीक्षण कोड लिखें। आपके मामले में: import co from 'co'.

आपके कंसोल के माध्यम से:

  • अपने पैकेज स्थापित करें: npm install
  • अपने स्रोत निर्देशिका को अपने आउटपुट निर्देशिका के साथ -d (aka --out-dir) ध्वज के रूप में, पहले से ही, हमारे पैकेज में निर्दिष्ट करें। json: npm run transpile-es2015
  • आउटपुट निर्देशिका से अपना कोड चलाएँ! node lib/index.js

दुर्भाग्यपूर्ण काम नहीं किया। Unexpected token import
डिपोल_मोमेंट

1
सुनिश्चित करें कि babelकमांड आपके खोज पथ में है। यहाँ थोड़ा बदलाव है। package.json: {"स्क्रिप्ट": {"ट्रांसपाइल": "./ode_modules/.bin/babel src -d lib"}, "devD dependencies": {"babel-cli": "^ 6.24.1," babel-preset- env ":" ^ 1.6.0 "}} .babelrc: {" प्रीसेट्स ": [" env "]}
मक्सिम येगोरोव

5

वर्तमान विधि का उपयोग करना है:

npm install --save-dev babel-cli babel-preset-env

और फिर में .babelrc

{
    "presets": ["env"]
}

यह js (es2015 और उससे आगे) के नवीनतम संस्करण के लिए बैबेल सपोर्ट स्थापित करें

निम्नानुसार अपनी js फ़ाइल को चलाते समय उपयोग के babel-nodeअंदर अपनी स्क्रिप्ट में जोड़ना न भूलें package.json

"scripts": {
   "test": "mocha",
    //Add this line to your scripts
   "populate": "node_modules/babel-cli/bin/babel-node.js" 
},

अब आप npm populate yourfile.jsटर्मिनल के अंदर कर सकते हैं।

यदि आप विंडोज़ चला रहे हैं और रनिंग एरर इंटरनल या एक्सटर्नल कमांड को नहीं पहचाना गया है, तो स्क्रिप्ट के नोड इनफ्रंट को फॉलो करें

node node_modules/babel-cli/bin/babel-node.js

फिर npm run populate


3

आपको हॉट-रीलोड के लिए बैबल -प्रीसेट- एनव और नोडमॉन का उपयोग करना होगा ।

फिर नीचे दी गई सामग्री के साथ .babelrc फ़ाइल बनाएं:

{
  "presets": ["env"]
}

अंत में, package.json में स्क्रिप्ट बनाएं:

"scripts": {
    "babel-node": "babel-node --presets=env",
    "start": "nodemon --exec npm run babel-node -- ./index.js",
    "build": "babel src -d dist"
  }

या बस इस बॉयलरप्लेट का उपयोग करें:

बॉयलरप्लेट: नोड- es6


2
  • स्थापित करें -> "npm i - save-dev babel-cli babel-preset-es2015 babel-preset-stage-0"

Package.json फ़ाइल में अगली स्क्रिप्ट "स्टार्ट" में जोड़ें : "babel-node server.js"

    {
  "name": "node",
  "version": "1.0.0",
  "description": "",
  "main": "server.js",
  "dependencies": {
    "body-parser": "^1.18.2",
    "express": "^4.16.2",
    "lodash": "^4.17.4",
    "mongoose": "^5.0.1"
  },
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "babel-node server.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

और रूट में। "

    {
    "presets":[
        "es2015",
        "stage-0"
    ]
}

और टर्मिनल में एनपीएम शुरू करें


1

समस्या को हल करने के लिए निम्नलिखित चरणों को शामिल करें:

1) CLI और env preset इंस्टॉल करें

$ npm install --save-dev babel-cli babel-preset-env

2) .babelrc फ़ाइल बनाएँ

{
  "presets": ["env"]
}

3) पैकेज में एनपीएम प्रारंभ कॉन्फ़िगर करें। जेसन

"scripts": {
    "start": "babel-node ./server/app.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  }

4) इसके बाद ऐप शुरू करें

$ npm start

0

मैंने समस्या को दूर करने के लिए निम्नलिखित कार्य किए हैं (उदाहरण के लिए स्क्रिप्ट)

संकट

$ cat ex.js
import { Stack } from 'es-collections';
console.log("Successfully Imported");

$ node ex.js
/Users/nsaboo/ex.js:1
(function (exports, require, module, __filename, __dirname) { import { Stack } from 'es-collections';
                                                              ^^^^^^

SyntaxError: Unexpected token import
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:152:10)
    at Module._compile (module.js:624:28)
    at Object.Module._extensions..js (module.js:671:10)
    at Module.load (module.js:573:32)
    at tryModuleLoad (module.js:513:12)
    at Function.Module._load (module.js:505:3)
    at Function.Module.runMain (module.js:701:10)
    at startup (bootstrap_node.js:194:16)
    at bootstrap_node.js:618:3

उपाय

# npm package installation
npm install --save-dev babel-preset-env babel-cli es-collections

# .babelrc setup
$ cat .babelrc
{
  "presets": [
    ["env", {
      "targets": {
        "node": "current"
      }
    }]
  ]
}

# execution with node
$ npx babel ex.js --out-file ex-new.js
$ node ex-new.js
Successfully Imported

# or execution with babel-node
$ babel-node ex.js
Successfully Imported

0

@ जोवी को आपको बस इतना करना है।

{
  "plugins": [
    "transform-strict-mode",
    "transform-es2015-modules-commonjs",
    "transform-es2015-spread",
    "transform-es2015-destructuring",
    "transform-es2015-parameters"
  ]
}

और npm के साथ इन प्लगइन्स को भक्ति के रूप में स्थापित करें।

फिर बेबल-नोड ***। js को फिर से आज़माएं। आशा है इससे आपको सहायता मिलेगी।


-4

आपके एप्लिकेशन में, आपको अपने require()मॉड्यूल घोषित करने होंगे, 'आयात' कीवर्ड का उपयोग नहीं करना चाहिए :

const app = require("example_dependency");

फिर, .babelrc फ़ाइल बनाएं:

{
"presets": [ 
    ["es2015", { "modules": false }]
]
}

फिर, अपने गुलदस्ते में, अपने require()मॉड्यूल घोषित करना सुनिश्चित करें :

var gulp = require("gulp");
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.