অপ্রত্যাশিত টোকেন রফতানি করা হচ্ছে


220

আমি আমার প্রকল্পে কিছু ES6 কোড চালানোর চেষ্টা করছি তবে আমি একটি অপ্রত্যাশিত টোকেন রফতানি ত্রুটি পাচ্ছি।

export class MyClass {
  constructor() {
    console.log("es6");
  }
}

5
কোনও সহায়তা দেওয়ার জন্য আপনার পরিবেশ বা কনফিগারেশন সম্পর্কে পর্যাপ্ত তথ্য নেই। এই ত্রুটিটি পরামর্শ দিচ্ছে যে ওয়েবপ্যাক বা বাবেল উভয়ই সঠিকভাবে কাজ করছে না, যেমনটি exportকেবল ES6 এ উপলব্ধ those এবং মডিউলগুলিই ES6 সমর্থন সরবরাহ করে।
Claies

24
আপনার ব্যবহার করা উচিত module.exports = MyClass, নাexport class MyClass
onwayway133

উত্তর:


249

আপনি ES6 মডিউল সিনট্যাক্স ব্যবহার করছেন।

এর অর্থ আপনার পরিবেশ (উদাঃ node.js) অবশ্যই ES6 মডিউল সিনট্যাক্স সমর্থন করবে।

নোডজেএস module.exportsES6 মডিউল সিনট্যাক্স ( exportকীওয়ার্ড) নয় কমনজেএস মডিউল সিনট্যাক্স ব্যবহার করে ।

সমাধান:

  • babelআপনার ES6 কে একটি commonjsলক্ষ্যে স্থানান্তর করতে এনপিএম প্যাকেজটি ব্যবহার করুন

অথবা

  • কমনজেএস সিনট্যাক্স সহ রিফ্যাক্টর।

কমনজেএস সিনট্যাক্সের উদাহরণগুলি হ'ল ( ফ্ল্যাভিওকপিপস / কমোনজস থেকে ):

  • exports.uppercase = str => str.toUpperCase()
  • exports.a = 1

15
কখন নোডেজ importস্থানীয়ভাবে সমর্থন করবে ? আমি ভেবেছিলাম v10.0.0 এর এটি থাকবে তবে দৃশ্যত তা নয়।
chovy

4
@ chovy পরীক্ষামূলক সমর্থন পতাকা "- এক্সপেরিমেন্টাল-মডিউল" সহ উপলব্ধ। ফাইলগুলির একটি .mjs এক্সটেনশন হওয়া দরকার
জিওভানি পি

1
আমি মডিউলগুলির জন্য স্থানীয় সমর্থন সহ ক্রোম 66 ব্যবহার করে এই ত্রুটিটি পাচ্ছি।
টম রাসেল

বিটিডাব্লু: নোট করুন যে পতাকাটির পিছনে নোড 10 / নোড 12 সমর্থন করে মডিউলগুলি, তারা আরপিএল মোডে এটি সমর্থন করে না - তবে এটি নোড 12-তে ইওল মোডে সমর্থিত
jakub.g

2
কারও জন্য এখনও কমনজেস সিনট্যাক্স সম্পর্কে পরিষ্কার নয়। দয়া করে এই লিঙ্কটি চেকআউট করুন, কিছুটা সাহায্য করতে পারেন। flaviocopes.com/commonjs
এলটি

142

আপনি যদি এই ত্রুটিটি পান তবে এটি আপনার HTML পৃষ্ঠায় জাভাস্ক্রিপ্ট ফাইলটি কীভাবে অন্তর্ভুক্ত করেছিলেন তা সম্পর্কিতও হতে পারে। মডিউলগুলি লোড করার সময় আপনাকে সেই ফাইলগুলি স্পষ্টভাবে ঘোষণা করতে হবে। এখানে একটি উদাহরণ:

//module.js:
function foo(){
   return "foo";
}

var bar = "bar";

export { foo, bar };

আপনি যখন স্ক্রিপ্টটি অন্তর্ভুক্ত করবেন:

<script src="module.js"></script>

আপনি ত্রুটি পাবেন:

আনকাচড সিনট্যাক্স এরিয়ার: অপ্রত্যাশিত টোকেন রফতানি

"মডিউল" তে সেট টাইপ অ্যাট্রিবিউট সহ আপনার ফাইলটি অন্তর্ভুক্ত করতে হবে:

<script type="module" src="module.js"></script>

এবং তারপরে এটি প্রত্যাশার মতো কাজ করবে এবং আপনি অন্য মডিউলে আপনার মডিউলটি আমদানি করতে প্রস্তুত:

import { foo, bar } from  "./module.js";

console.log( foo() );
console.log( bar );

37
"সর্বাধিক-উত্সাহিত" উত্তরের বিপরীতে, এটি আসলে সমস্যাটি সমাধান করে এবং ব্যাখ্যা করে যে কেন এটি ঘটছে তা ব্যাখ্যা করে যে একমাত্র বিকল্পটি একটি সাধারণ জেএস পদ্ধতি, এপিএম পদ্ধতি, বা আমাদের কোড ট্রান্সপ্লাইস করা ... এটিও ব্যতিক্রম হবে ডাব্লু 3 সি স্ট্যান্ডার্ডে যেখানে typeএকটি বৈধ মাইম টাইপ (যেমন। মিডিয়া টাইপ) হওয়ার আশা করা হচ্ছে, তাই এটি একটি অপ্রত্যাশিত অনুসন্ধান find ধন্যবাদ!
শান উইলসন

4
এটি ত্রুটিটি সংশোধন করে তবে আমি ক্রোম in 67 এ আমদানি স্টেটমেন্টের লাইনের সাথে "অনাকাঙ্ক্ষিত টোকেন get" পাই যা স্ক্রিপ্টটি ইনলাইন যেমন <স্ক্রিপ্ট> আমদানি ... </
translation

1
@ পান্ডাওয়ুড আপনি <script type="module">import ...</script>যখন মডিউলটি থেকে আমদানি করবেন তখন আপনাকে ব্যবহার করতে হবে । আমি এটি ক্রোমিয়ামের সাম্প্রতিক সংস্করণে পরীক্ষা করেছি।
ভ্লাদিমির এস।

এটি আমার ইস্যুটি ঠিক করেছে :)
ব্যবহারকারীর 651476

খাঁটি জেএস (ইএস 6) আমদানি সমর্থন করেছে এবং এটি কেন আমি এর সাথে মিলিত হয়েছিল ঠিক তা ব্যাখ্যা করে
এরিক

15

আমার দুই সেন্ট

রপ্তানি

ES6

myClass.js

export class MyClass1 {
}
export class MyClass2 {
}

other.js

import { MyClass1, MyClass2 } from './myClass';

কমনজেএস বিকল্প

myClass.js

class MyClass1 {
}
class MyClass2 {
}
module.exports = { MyClass1, MyClass2 }
// or
// exports = { MyClass1, MyClass2 };

other.js

const { MyClass1, MyClass2 } = require('./myClass');

ডিফল্ট রফতানি করুন

ES6

myClass.js

export default class MyClass {
}

other.js

import MyClass from './myClass';

কমনজেএস বিকল্প

myClass.js

module.exports = class MyClass1 {
}

other.js

const MyClass = require('./myClass');

আশাকরি এটা সাহায্য করবে


ES6 ডিফল্ট রফতানি উদাহরণের জন্য, আপনি "ডিফল্ট এক্সপোর্ট" লিখেছেন, তবে এটি "এক্সপোর্ট ডিফল্ট" হওয়া উচিত।
আইএএম_এল_এক্স

মাছ ধরার জন্য :-) @IAM_AL_X ধন্যবাদ
Barnstokkr

10

ES6 অ্যাড ব্যবহার করতে babel-preset-env

এবং আপনার .babelrc:

{
  "presets": ["@babel/preset-env"]
}

উত্তরটি আপডেট করুন @ ব্যাঙ্কেল মন্তব্যে বাবেল 7 প্রয়োগ করার জন্য ধন্যবাদ।


8
বাবেলকে ব্যাখ্যা করার বিষয়ে নয় তাঁর প্রশ্ন। সুতরাং কেন এমন কিছু উত্তর দেওয়া উচিত নয় যা অন্যকে বিভ্রান্ত করতে পারে?
জালাল

7
@ মমস্টো এই প্রশ্নটি ইতিমধ্যে babelলেখক ট্যাগ করেছিলেন। ফিল রিকেটস উত্তরটি সমস্যার স্পষ্ট করে দেয়, যা ভাল, এই উত্তরটি লেখকের সমস্যার প্রত্যক্ষ সমাধান।
বালক


6

আপনি যখন ডিফল্ট জাভাস্ক্রিপ্ট মডিউল রফতানি সহজেই ব্যবহার করতে পারেন তখন এই মুহুর্তে বাবেল ব্যবহার করার দরকার নেই (জেএস খুব শক্তিশালী হয়ে উঠেছে)। সম্পূর্ণ টিউটোরিয়াল পরীক্ষা করে দেখুন

Message.js

module.exports = 'Hello world';

app.js

var msg = require('./Messages.js');

console.log(msg); // Hello World

2
আচ্ছা আপনি কীভাবে তখন ক্লাস রফতানি করবেন?
শেরউইন আবলাñা দাপিতো

1
আমি আমার উত্তরটি মুছে দিচ্ছি কারণ প্রশ্নটি আসলে ES6 এর জন্য ছিল এবং নোডজেএস দ্বারা ব্যবহৃত সাধারণ জেএস নয়। একটি উত্তরের জন্য উপরে চেক করুন।
অ্যালভিন কোন্ডা

@ শেরউইনআব্লানাডাপিটো মডিউল.এক্সপোর্টস = ক্লাস মাই ক্লাস}} কাজ করে
মেরিয়ান ক্লাস্প্পিজ

3

Babel প্যাকেজ ইনস্টল করুন @babel/coreএবং @babel/presetযা নোড JS হিসাবে একটি commonjs টার্গেটের ES6 রূপান্তর সরাসরি ES6 লক্ষ্যমাত্রা বোঝে না হবে

npm install --save-dev @babel/core @babel/preset-env

তারপরে .babelrcআপনার প্রকল্পের মূল ডিরেক্টরিতে নামের সাথে একটি কনফিগারেশন ফাইল তৈরি করতে হবে এবং এই কোডটি এখানে যুক্ত করতে হবে

{ "presets": ["@babel/preset-env"] }


আমাকে @ বাবেল / রেজিস্টার ইনস্টল করারও দরকার ছিল, অন্যথায় আমি তখনও "সিনট্যাক্স এরর: মডিউলের বাইরে আমদানি বিবৃতি ব্যবহার করতে পারি না"
আণবিক

3

আমি এন্ট্রি পয়েন্ট ফাইলটি তৈরি করে এটি ঠিক করেছি।

// index.js
require = require('esm')(module)
module.exports = require('./app.js')

এবং এর app.jsবাইরে এবং এর বাইরে আমি যে কোনও ফাইল আমদানি করেছি তা imports/exports এখন আপনার মতো চালানোnode index.js

নোট: যদি app.jsব্যবহারসমূহ export default, এই হয়ে require('./app.js').defaultযখন এন্ট্রি পয়েন্ট ফাইল ব্যবহার করে।


1
সরল প্রকল্পগুলির জন্য সেরা উত্তরটির জন্য বাবেল, ওয়েবপ্যাক, পার্সেল ইত্যাদির প্রয়োজন নেই ... আমি প্রকল্পের জন্য সরল / সার্ভার এক্সপ্রেস সহ মনোরেপো প্রকল্পে ব্যবহার করেছি।
কবজির

-3

ES6 সিনট্যাক্স ব্যবহার নোডে কাজ করে না, দুর্ভাগ্যক্রমে, সংকলক যেমন রফতানি বা আমদানির মতো সিনট্যাক্সটি বোঝার জন্য আপনার স্পষ্টতই বাবেল থাকতে হবে।

npm install babel-cli --save

এখন আমাদের একটি .babelrc ফাইল তৈরি করতে হবে, বাবেলর্ক ফাইলটিতে, আমরা ES5 তে সংকলন করার সময় এর প্রিসেট হিসাবে ইনস্টল করা es2015 প্রিসেটটি ব্যবহার করতে বাবেল সেট করব।

আমাদের অ্যাপ্লিকেশনটির মূলে আমরা একটি .babelrc ফাইল তৈরি করব। ave npm ইনস্টল ব্যাবেল-প্রিসেট-এস2015 - সংরক্ষণ করুন

আমাদের অ্যাপ্লিকেশনটির মূলে আমরা একটি .babelrc ফাইল তৈরি করব।

{  "presets": ["es2015"] }

আশা করি এটা কাজ করবে ... :)

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