ionic2 ट्यूटोरियल
आयनिक 2 से शुरुआत करना
खोज…
टिप्पणियों
Ionic 2 एक क्रॉस-प्लेटफॉर्म मोबाइल डेवलपमेंट टेक्नोलॉजी है। यह ढांचा हाइब्रिड मोबाइल अनुप्रयोगों के निर्माण के लिए बनाया गया है और इसका उपयोग डेस्कटॉप अनुप्रयोग के लिए भी किया जा सकता है। यह एक बार लिखा गया है, हर जगह प्रौद्योगिकी चल रही है। यह जावास्क्रिप्ट / टाइपस्क्रिप्ट, कोणीय 2, HTML और सीएसएस (SCSS / LESS) जैसी वेब तकनीकों का उपयोग करता है। Ionic2 ऐप >=android 4.4 पर अच्छा काम करता है, लेकिन आप android 4.1 पर android 4.3 पर चलना चाहते हैं । आपको क्रॉस वॉक का उपयोग करना होगा।
स्थापना या सेटअप
चूंकि Ionic 2 हर दिन बेहतर और बेहतर हो रहा है, इसलिए कृपया नवीनतम परिवर्तनों और सुधारों पर नज़र रखने के लिए हमेशा आधिकारिक दस्तावेज़ देखें ।
आवश्यक शर्तें: Ionic 2 परियोजनाओं के निर्माण के लिए आपको NodeJS की आवश्यकता होगी। आप यहां नोड डाउनलोड और इंस्टॉल कर सकते हैं और npm और पैकेज Ionic 2 के बारे में अधिक जान सकते हैं ।
1. Ionic 2 स्थापित करना
Ionic 1 की तरह, आप सही तरीके से ब्राउज़र में ऐप्स बनाने और परीक्षण करने के लिए Ionic CLI या GUI का उपयोग कर सकते हैं। यहां तक कि इसमें आपके Ionic 1 ऐप के साथ काम करने की सभी कार्यक्षमता है, इसलिए आपको एक चीज़ बदलने की आवश्यकता नहीं होगी!
Ionic 2 का उपयोग करने के लिए बस npm से आयनिक स्थापित करें:
$ npm install -g ionic
यदि आपको EACCES की त्रुटि मिलती है, तो नोड को अनुमति देने के लिए यहां दिए गए निर्देशों का पालन करें।
2. अपना पहला ऐप बनाना
एक बार सीएलआई स्थापित होने के बाद, अपना पहला ऐप शुरू करने के लिए निम्न कमांड चलाएँ:
$ ionic start MyIonic2Project
टैब टेम्प्लेट का उपयोग डिफ़ॉल्ट रूप से किया जाता है, लेकिन आप किसी ध्वज में पास होकर किसी अन्य टेम्पलेट का चयन कर सकते हैं। उदाहरण के लिए:
$ ionic start MyIonic2Project tutorial
$ cd MyIonic2Project
$ npm install
यह ट्यूटोरियल टेम्पलेट का उपयोग करेगा।
अपने एप्लिकेशन को चलाने के लिए, अपने प्रोजेक्ट्स निर्देशिका में बदलें और ionic serve -lc :
$ ionic serve -lc
-L पृष्ठ के लाइव पुनः लोड को सक्रिय करता है, -c कंसोल लॉग को प्रदर्शित करता है। यदि आप अपना ऐप बनाने में समस्या कर रहे हैं, तो सुनिश्चित करें कि आपका पैकेज .json आयनिक 2-ऐप-बेस में से मेल खाता है
आप अपने नए ऐप के साथ ब्राउज़र में खेल सकते हैं!
3. एक डिवाइस के लिए निर्माण
आप अपने नए ऐप को एक भौतिक डिवाइस या डिवाइस एमुलेटर पर भी बना सकते हैं। आगे बढ़ने के लिए आपको कॉर्डोवा की आवश्यकता होगी।
कॉर्डोवा को स्थापित करने के लिए, चलाएं:
$ npm install -g cordova
IOS एप्लिकेशन बनाने के लिए iOS सिम्युलेटर डॉक्स देखें (नोट: आप iOS डिवाइस या OSX के अलावा किसी भी ऑपरेटिंग सिस्टम पर एमुलेटर का निर्माण नहीं कर सकते हैं), या एंड्रॉइड एप्लिकेशन बनाने के लिए Genymotion डॉक्स।
IOS डिवाइस पर चल रहा है:
IOS ऐप बनाने के लिए, आपके लिए OSX कंप्यूटर पर काम करना आवश्यक है, क्योंकि ios के लिए निर्माण करने में सक्षम होने के लिए आपको कोको फ्रेमवर्क की आवश्यकता होगी, यदि ऐसा है तो आपको सबसे पहले प्लेटफ़ॉर्म को कॉर्डोवा में चलाकर जोड़ना होगा। निम्नलिखित आदेश:
$ ionic cordova platform add ios
IOS डिवाइस को संकलित करने के लिए आपको Xcode की आवश्यकता होगी।
अंत में, निम्न कमांड के साथ अपना ऐप चलाएं:
$ ionic cordova run ios
Android डिवाइस पर चल रहा है:
Android के लिए चरण लगभग समान हैं। सबसे पहले, मंच जोड़ें:
$ ionic cordova platform add android
फिर एंड्रॉइड एसडीके स्थापित करें जो आपको एंड्रॉइड डिवाइस को संकलित करने की अनुमति देता है। हालांकि एंड्रॉइड एसडीके एक एमुलेटर के साथ आता है, यह वास्तव में धीमा है। उत्पत्ति बहुत तेज है। एक बार स्थापित होने के बाद, बस निम्नलिखित कमांड चलाएँ:
$ ionic cordova run android
और बस! अपना पहला Ionic 2 ऐप बनाने के लिए बधाई!
आयोनिक में लाइव लोडिंग भी है। इसलिए यदि आप अपने ऐप को विकसित करना चाहते हैं और एमुलेटर / डिवाइस पर लाइव बदलाव देख रहे हैं, तो आप निम्न कमांड चलाकर ऐसा कर सकते हैं:
IOS के लिए:
$ ionic cordova emulate ios -lcs
IOS 9.2.2 पर सावधान रहें, लिवरेलड काम नहीं करता है। यदि आप लिवरेलड के साथ काम करना चाहते हैं, तो config.xml फ़ाइल को निम्न जोड़कर संपादित करें:
<allow-navigation href="*"/>
फिर <platform name="ios"> :
<config-file parent="NSAppTransportSecurity" platform="ios" target="*-Info.plist">
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
</config-file>
एंड्रॉयड के लिए:
$ ionic cordova run android -lcs
l अर्थ है, कंसोल लॉग के लिए live-reload, c और सर्वर लॉग के लिए s । यह आपको यह देखने की अनुमति देगा कि निष्पादन के दौरान कोई त्रुटि / चेतावनी है या नहीं।
विंडोज के लिए बिल्डिंग
यदि आप विंडोज़ के लिए अपना प्रोजेक्ट बनाना चाहते हैं, तो आपको विंडोज़ कंप्यूटर पर काम करना होगा। निम्न कमांड को चलाकर अपने आयनिक 2 प्रोजेक्ट में विंडोज़ प्लेटफॉर्म को शुरू करने के लिए:
$ionic cordova platform add windows
तो बस निम्नलिखित आदेश चलाएँ:
$ionic cordova run windows
ब्राउज़र में चलाने के लिए
$ionic serve
क्रोम ब्राउज़र के लिए डिवाइस का निरीक्षण करें। (क्रोम ब्राउज़र के एड्रेस बार में टाइप करें)
chrome://inspect/#devices