আমি একজন তৈরি করছি Ionic
ব্যবহার অ্যাপ্লিকেশন es6 modules
, TypeScript
এবং SystemJS
একটি মডিউল লোডার হিসেবে। এটি আমার সেটআপ:
tsconfig.json:
{
"compilerOptions": {
...
"target": "es5",
"module": "system",
...
}
}
index.html:
<script src="lib/system.js"></script>
<script src="systemjs.config.js"></script>
<script>System.import('js/app.js')</script>
উদাহরণ স্ক্রিপ্ট (টাইপস্ক্রিপ্ট):
import {IConfig} from "./app-config";
export class ConfigLoader {
...
}
ক্রোমে দুর্দান্ত কিছু চলে। তবে, সাফারির ওয়েব ইন্সপেক্টর ব্যবহার করে ডিবাগ করার সময় আমি স্ক্রিপ্টগুলিতে কোনও ব্রেকপয়েন্ট রাখতে পারি না কারণ ওয়েব ইন্সপেক্টর কেবলমাত্র স্ক্রিপ্টগুলি প্রদর্শন করে যা সরাসরি এইচটিএমএল থেকে লিপি করা হয় (স্ক্রিপ্ট ট্যাগের মাধ্যমে), এবং এক্সএইচআর দ্বারা লোড হওয়া স্ক্রিপ্টগুলি না (আমার ক্ষেত্রে, সিস্টেমজেএস দ্বারা) । এর অর্থ আমি নিজের স্ক্রিপ্টগুলি ডিবাগ করতে পারি না, এটি অবশ্যই অগ্রহণযোগ্য।
আমি আগের মতো সিস্টেমজেএস ব্যবহার করে এটি ঘিরে কাজ করার চেষ্টা করেছি, তবে এইচটিএমএলে স্ক্রিপ্ট ট্যাগগুলি রেখেছি:
<script src="lib/system.js"></script>
<script src="systemjs.config.js"></script>
<script src="js/app-config.js"></script>
... other app scripts
<script>System.import('js/app.js')</script>
তবে এটি কার্যকর হয় না, কারণ সিস্টেমজেএস এ সম্পর্কে খুশি মনে হয় না:
অবৈধ System.register কল। বেনামি System.register কলগুলি কেবলমাত্র সিস্টেমজেএস.আইম্পোর্ট দ্বারা লোড করা মডিউল দ্বারা করা যেতে পারে এবং স্ক্রিপ্ট ট্যাগের মাধ্যমে নয়।
আমি কীভাবে সিস্টেমজেএস ব্যবহার করব এবং একই সাথে সাফারিতে ডিবাগ করার ক্ষমতা রাখব? আমি 'প্রতিটি স্ক্রিপ্টে একটি ডিবাগার স্টেটমেন্ট' রাখার চেয়ে কিছুটা পরিশীলিত সমাধানের সন্ধান করছি ...