আমি আমার প্রকল্পে কিছু ES6 কোড চালানোর চেষ্টা করছি তবে আমি একটি অপ্রত্যাশিত টোকেন রফতানি ত্রুটি পাচ্ছি।
export class MyClass {
constructor() {
console.log("es6");
}
}
module.exports = MyClass
, নাexport class MyClass
আমি আমার প্রকল্পে কিছু ES6 কোড চালানোর চেষ্টা করছি তবে আমি একটি অপ্রত্যাশিত টোকেন রফতানি ত্রুটি পাচ্ছি।
export class MyClass {
constructor() {
console.log("es6");
}
}
module.exports = MyClass
, নাexport class MyClass
উত্তর:
আপনি ES6 মডিউল সিনট্যাক্স ব্যবহার করছেন।
এর অর্থ আপনার পরিবেশ (উদাঃ node.js) অবশ্যই ES6 মডিউল সিনট্যাক্স সমর্থন করবে।
নোডজেএস module.exports
ES6 মডিউল সিনট্যাক্স ( export
কীওয়ার্ড) নয় কমনজেএস মডিউল সিনট্যাক্স ব্যবহার করে ।
সমাধান:
babel
আপনার ES6 কে একটি commonjs
লক্ষ্যে স্থানান্তর করতে এনপিএম প্যাকেজটি ব্যবহার করুনঅথবা
কমনজেএস সিনট্যাক্সের উদাহরণগুলি হ'ল ( ফ্ল্যাভিওকপিপস / কমোনজস থেকে ):
exports.uppercase = str => str.toUpperCase()
exports.a = 1
import
স্থানীয়ভাবে সমর্থন করবে ? আমি ভেবেছিলাম v10.0.0 এর এটি থাকবে তবে দৃশ্যত তা নয়।
আপনি যদি এই ত্রুটিটি পান তবে এটি আপনার 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 );
type
একটি বৈধ মাইম টাইপ (যেমন। মিডিয়া টাইপ) হওয়ার আশা করা হচ্ছে, তাই এটি একটি অপ্রত্যাশিত অনুসন্ধান find ধন্যবাদ!
<script type="module">import ...</script>
যখন মডিউলটি থেকে আমদানি করবেন তখন আপনাকে ব্যবহার করতে হবে । আমি এটি ক্রোমিয়ামের সাম্প্রতিক সংস্করণে পরীক্ষা করেছি।
আমার দুই সেন্ট
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 অ্যাড ব্যবহার করতে babel-preset-env
এবং আপনার .babelrc
:
{
"presets": ["@babel/preset-env"]
}
উত্তরটি আপডেট করুন @ ব্যাঙ্কেল মন্তব্যে বাবেল 7 প্রয়োগ করার জন্য ধন্যবাদ।
babel
লেখক ট্যাগ করেছিলেন। ফিল রিকেটস উত্তরটি সমস্যার স্পষ্ট করে দেয়, যা ভাল, এই উত্তরটি লেখকের সমস্যার প্রত্যক্ষ সমাধান।
আপনি যখন ডিফল্ট জাভাস্ক্রিপ্ট মডিউল রফতানি সহজেই ব্যবহার করতে পারেন তখন এই মুহুর্তে বাবেল ব্যবহার করার দরকার নেই (জেএস খুব শক্তিশালী হয়ে উঠেছে)। সম্পূর্ণ টিউটোরিয়াল পরীক্ষা করে দেখুন
Message.js
module.exports = 'Hello world';
app.js
var msg = require('./Messages.js');
console.log(msg); // Hello World
Babel প্যাকেজ ইনস্টল করুন @babel/core
এবং @babel/preset
যা নোড JS হিসাবে একটি commonjs টার্গেটের ES6 রূপান্তর সরাসরি ES6 লক্ষ্যমাত্রা বোঝে না হবে
npm install --save-dev @babel/core @babel/preset-env
তারপরে .babelrc
আপনার প্রকল্পের মূল ডিরেক্টরিতে নামের সাথে একটি কনফিগারেশন ফাইল তৈরি করতে হবে এবং এই কোডটি এখানে যুক্ত করতে হবে
{
"presets": ["@babel/preset-env"]
}
আমি এন্ট্রি পয়েন্ট ফাইলটি তৈরি করে এটি ঠিক করেছি।
// 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
যখন এন্ট্রি পয়েন্ট ফাইল ব্যবহার করে।
ES6 সিনট্যাক্স ব্যবহার নোডে কাজ করে না, দুর্ভাগ্যক্রমে, সংকলক যেমন রফতানি বা আমদানির মতো সিনট্যাক্সটি বোঝার জন্য আপনার স্পষ্টতই বাবেল থাকতে হবে।
npm install babel-cli --save
এখন আমাদের একটি .babelrc ফাইল তৈরি করতে হবে, বাবেলর্ক ফাইলটিতে, আমরা ES5 তে সংকলন করার সময় এর প্রিসেট হিসাবে ইনস্টল করা es2015 প্রিসেটটি ব্যবহার করতে বাবেল সেট করব।
আমাদের অ্যাপ্লিকেশনটির মূলে আমরা একটি .babelrc ফাইল তৈরি করব। ave npm ইনস্টল ব্যাবেল-প্রিসেট-এস2015 - সংরক্ষণ করুন
আমাদের অ্যাপ্লিকেশনটির মূলে আমরা একটি .babelrc ফাইল তৈরি করব।
{ "presets": ["es2015"] }
আশা করি এটা কাজ করবে ... :)
export
কেবল ES6 এ উপলব্ধ those এবং মডিউলগুলিই ES6 সমর্থন সরবরাহ করে।