নোডেজ 5 এবং বাবেলে "অপ্রত্যাশিত টোকেন আমদানি"?


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
@ ফেলিক্সকলিং: যদিও লিঙ্কযুক্ত প্রশ্নের উত্তর অবশ্যই এই প্রশ্নের উত্তর দেয়, তবে এই প্রশ্নের উত্তরটির সদৃশ হিসাবে দেখা কঠিন। যাইহোক, গুগল আমাকে এখানে সরাসরি এনেছে বলে আমি এখানে এটি পেয়ে আনন্দিত হয়েছিল কারণ বর্ণিত বাক্য গঠন ত্রুটিটি যা দেখেছে তার সাথে ঠিক মিলেছে ched আমি সত্যই খুশি যে ওপি পোস্টের পরিবর্তে কিছুটা সম্পর্কিত প্রশ্নের উত্তর অনুসন্ধানের পরিবর্তে এটি পোস্ট করেছে fit
স্কট স্যয়েট

3
npm i --save-dev babel-cli এটি আমার জন্য স্থির করে ...
চকজে হার্দি

2
আমি এটি একটি সদৃশ হিসাবে চিহ্ন চিহ্ন ভোট, আমি মনে করি এটি একটি পৃথক প্রশ্ন।
TWR কোল

3
এটি কোনও সদৃশ নয়। অন্য একটি সমাধান আমি পোস্ট করতে চাই ডবল চেক আপনি এই প্লাগিন আছে হয় .babelrc: "transform-es2015-modules-commonjs"
ড্যান ড্যাসকলেসকু

7
সদৃশগুলি (হওয়া উচিত) ঠিক আছে। মানুষ কীভাবে কাজ করে এটি একটি গুরুত্বপূর্ণ অংশ। @ স্কটসৌয়েত যা বলেন তার অন্যতম কারণ is বিভিন্ন দৃষ্টিভঙ্গি সহ বিভিন্ন ব্যাখ্যা অন্যটি। এই পুরো 'সদৃশ শিকার' বছরের পর বছর ধরে নিয়মিত দর্শনার্থী হিসাবে আমার কাছে খুব অসহায় বোধ করে। আমি আশা করি এটি বন্ধ হয়ে যায়।
স্টিজন ডি উইট

উত্তর:


202

বাবেল থেকে 6 রিলিজ নোট:

বাবেল যেহেতু জাভাস্ক্রিপ্ট টুলিংয়ের জন্য প্ল্যাটফর্ম হওয়ার দিকে মনোনিবেশ করছে এবং কোনও ES2015 ট্রান্সপোর্টার নয়, তাই আমরা সমস্ত প্লাগইনকে অপ্ট-ইন করার সিদ্ধান্ত নিয়েছি। এর অর্থ আপনি যখন বাবেল ইনস্টল করবেন এটি ডিফল্টরূপে আপনার ES2015 কোডটি আর স্থানান্তর করবে না।

আমার সেটআপে আমি es2015 প্রিসেটটি ইনস্টল করেছি

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

বা সুতা দিয়ে

yarn add babel-preset-es2015 --dev

এবং আমার .babelrc এ প্রিসেটটি সক্ষম করেছে

{
  "presets": ["es2015"]
}

14
ভাল উত্তর. দুর্ভাগ্যক্রমে, আপনাকে এখনও প্রয়োজন () ব্যবহার করতে হবে এবং এনএমপি প্যাকেজগুলির জন্য আমদানি ব্যবহার করতে পারবেন না।
জগতেশ চधा

24
আমি babel-nodeএকসাথে es2015এবং reactপ্রিসেট ব্যবহার করি একই ত্রুটি।
ফিজি

3
কাজ হয়নি। হ্যাঁ এটি প্রয়োজন, তবে এটি আমদানির কাজ করে না।
এখনও_ড্রিমিং_1

6
আমার জন্য এটি একটি সহজ সমাধান ছিল। আমি একটি প্রতিক্রিয়া / বাবেল প্রকল্প থেকে অন্য একটি এস 5 প্রকল্পে কোডটি অভিযোজিত করতে এবং একই সাথে এস synt সিনট্যাক্সে আপগ্রেড করার চেষ্টা করে টানেল ভিশনে ধরা পড়েছিলাম। স্ক্রিপ্টগুলির অধীনে আমার প্যাকেজ.জসনে আমি "নোড রান" প্রতিস্থাপন করতে ভুলে গেছি "ব্যাবেল-নোড রান.জেএস" দিয়ে। হ্যাঁ, আমি মেষশাবক বোধ করছি। :)
joezen777

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" } }] ] }
রনেন

এর পরে আমি ত্রুটি পেতে শুরু করেছি (অচেনা টোকেন '<'): সার্ভার.জস:Unexpected token (37:12) 35 | const initialState = store.getState(); 36 | const componentHTML = renderToString( > 37 | <Provider store={store}> | ^ 38 | <RouterContext {...props} /> 39 | </Provider>, 40 | );
একে

26
  1. প্যাকেজ ইনস্টল করুন: babel-core, babel-polyfill,babel-preset-es2015
  2. .babelrcসামগ্রী সহ তৈরি করুন :{ "presets": ["es2015"] }
  3. না করা না importআপনার প্রধান এন্ট্রি ফাইলে বিবৃতি অন্য ফাইল যেমন ব্যবহার করুন: app.jsএবং আপনার প্রধান এন্ট্রি ফাইলে প্রয়োজনীয় উচিত babel-core/registerএবং babel-polyfillBabel অন্য কিছু আগে প্রথম স্থানে আলাদাভাবে কাজ করে না। তারপরে আপনি app.jsযেখানে importবিবৃতি প্রয়োজন তা করতে পারেন ।

উদাহরণ:

index.js

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

app.js

import co from 'co';

এটি সঙ্গে কাজ করা উচিত node index.js


1
এটি একটি সহজ কাজ যা উন্নয়নের জন্য ব্যবহার করা যেতে পারে। যদিও উত্পাদনের জন্য আপনার সর্বদা আপনার এস 5 কোডটি সংকলন করা উচিত।
জোনাস ড্রটলফ

অপেক্ষা করুন ... এটাই কি আমার মনে হয়? কয়েক মাস আগে আমার স্বপ্ন ছিল যে জাভাস্ক্রিপ্ট / পার্ল / যে কোনও ভাষা একই ভাষায় বিদ্যমান ভাষার কাস্টম অতিরিক্ত পার্সিংয়ের মাধ্যমে আপডেট ছাড়াই বাড়ানো যেতে পারে। এখানে কি ঘটছে ???
দিমিত্রি

দুর্দান্ত উত্তর। তবে স্ক্রিপ্টগুলিতে আপনি নীচের মতো কিছু রাখতে পারেন। সুতরাং আপনি যে কোনও ফাইল ব্যবহার করতে পারেন। "স্ক্রিপ্টস": build "বিল্ড": "বাবেল সিআরসি-ডি ডিস", "শুরু": "নোড ডিস / ইনডেক্স.জেএস"}
গার্থিক্স

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

এটি এমন হতে পারে যে আপনি অসম্পূর্ণ ফাইল চালাচ্ছেন। পরিষ্কার শুরু করা যাক!

আপনার কাজের ডিরেক্টরিতে এটি তৈরি করুন:

  • দুটি ফোল্ডার। প্রাকম্পম্পাইল এস2015 কোডের জন্য একটি। বাবেল আউটপুট জন্য অন্য। আমরা তাদের যথাক্রমে "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 (ওরফে - আউট-ডির) পতাকা হিসাবে ইতিমধ্যে, আমাদের প্যাকেজ.জসনে উল্লিখিত হিসাবে স্থানান্তর করুন: npm run transpile-es2015
  • আউটপুট ডিরেক্টরি থেকে আপনার কোড চালান! node lib/index.js

দুর্ভাগ্যজনকভাবে কাজ করেননি। Unexpected token import
ডিপোল_মোমেন্ট

1
babelকমান্ডটি আপনার অনুসন্ধানের পথে রয়েছে তা নিশ্চিত করুন । এখানে কিছুটা ভিন্নতা রয়েছে। package.json: {"স্ক্রিপ্ট": transp "ট্রান্সপাইল": "। env ":" ^ 1.6.0 "}} .babelrc: pre" প্রিসেটস " : [" এনভিভি "]}
মাকসিম ইয়েগোরভ

5

বর্তমান পদ্ধতিটি হ'ল:

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

এবং তারপর ভিতরে .babelrc

{
    "presets": ["env"]
}

এটি ইনস্টল করুন জেএসের সর্বশেষ সংস্করণ (এস2015 এবং এর বাইরে) ব্যাবেল সমর্থনগুলি ব্যাবেলজগুলি পরীক্ষা করে দেখুন

নীচে আপনার জেএস ফাইলটি চালানোর সময় ব্যবহারের 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

আপনি ব্যবহার করতে হবে Babel-প্রিসেট-env এবং nodemon হট রিলোড জন্য।

তারপরে নীচের সামগ্রী সহ .babelrc ফাইলটি তৈরি করুন:

{
  "presets": ["env"]
}

অবশেষে, প্যাকেজ.জসনে স্ক্রিপ্ট তৈরি করুন:

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

বা কেবল এই বয়লারপ্লেটটি ব্যবহার করুন:

বয়লারপ্লেট: নোড-এস 6


2
  • ইনস্টল করুন -> "এনপিএম আমি - সেভ-ডেবেল ব্যাবেল-ক্লিপ ব্যাবেল-প্রিসেট-এস2015 ব্যাবেল-প্রসেট-পর্যায় -0"

পরবর্তী প্যাকেজ.জসন ফাইলের স্ক্রিপ্টগুলিতে "স্টার্ট": "বাবেল-নোড সার্ভার.জেএস" যুক্ত করুন

    {
  "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"
}

এবং মূল ".babelrc" এ, বাবেলের জন্য ফাইল তৈরি করুন

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

এবং টার্মিনালে এনটিএম স্টার্ট চালান


1

সমস্যাটি সমাধানের জন্য নিম্নলিখিত পদক্ষেপগুলি অন্তর্ভুক্ত করুন:

1) সিএলআই এবং এনভিটি প্রিসেট ইনস্টল করুন

$ 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

সমস্যাটি কাটিয়ে উঠতে আমি নিম্নলিখিতগুলি করেছি (ex.js লিপি)

সমস্যা

$ 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

@ জোভি আপনাকে যা করতে হবে তা হ'ল .babelrc ফাইলটি যুক্ত করুন:

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

এবং এই প্লাগইনগুলি এনপিএমের সাথে নির্ভরতা হিসাবে ইনস্টল করুন।

তারপরে আবার ব্যাবেল-নোড ***। জেএস চেষ্টা করুন। আশা করি এটি আপনাকে সাহায্য করতে পারে


-4

আপনার অ্যাপ্লিকেশনটিতে, আপনাকে অবশ্যই আপনার require()মডিউলগুলি ঘোষণা করতে হবে , 'আমদানি' কীওয়ার্ডটি ব্যবহার না করে:

const app = require("example_dependency");

তারপরে একটি .babelrc ফাইল তৈরি করুন:

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

তারপরে, আপনার গল্পফাইলে আপনার require()মডিউলগুলি ঘোষণা করতে ভুলবেন না :

var gulp = require("gulp");
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.