Angularjs সেরা অনুশীলন minifies


103

আমি http://www.alexrothenberg.com/2013/02/11/the-magic-behind-angularjs-d dependency-inication.html পড়ছি এবং দেখা গেল যে আপনি যদি আপনার জাভাস্ক্রিপ্টটি মিনিমাইট করে দেন তবে কৌণিকটি নির্ভরতা ইনজেকশনটিতে সমস্যা রয়েছে তাই আমি এর পরিবর্তে যদি ভাবছি

var MyController = function($scope, $http) {
    $http.get('https://api.github.com/repos/angular/angular.js/commits')
      .then(function(response) {
        $scope.commits = response.data
      })
  }

আপনার ব্যবহার করা উচিত

var MyController = ['$scope', '$http', function($scope, $http) {
  $http.get('https://api.github.com/repos/angular/angular.js/commits')
    .then(function(response) {
      $scope.commits = response.data
    })
}]

সব মিলিয়ে আমি ভেবেছিলাম দ্বিতীয় স্নিপেটটি অ্যাঙ্গুলারজ পুরানো সংস্করণের জন্য তবে ....

আমি কি সবসময় ইনজেকশন উপায় (দ্বিতীয়টি) ব্যবহার করব?

উত্তর:


102

হ্যাঁ , সর্বদা! সুতরাং এইভাবে এমনকি যদি আপনার মিনিফারটি $ স্কোপটিকে ভেরিয়েবল এ এবং $ http কে ভেরিয়েবল বিতে রূপান্তর করে, তাদের পরিচয় এখনও স্ট্রিংগুলিতে সংরক্ষিত থাকে।

অ্যাংুলারজেএস ডক্সের এই পৃষ্ঠাটি দেখুন , মিনিফিকেশনে একটি নোটে স্ক্রোল করুন

হালনাগাদ

বিকল্পভাবে, আপনি এই ভার্বোসটি এড়াতে আপনার বিল্ড প্রক্রিয়ায় এনজি- এনোটেট এনপিএম প্যাকেজটি ব্যবহার করতে পারেন ।


এটি, এবং অন্যান্য কয়েকটি বিষয় খুব ভালভাবে ডিম্বাণু.আইও-তে ব্যাখ্যা করা হয়েছে। জেএফওয়াই
ওয়াটেনস্প্রেলস

@ প্রোটেনওয়ালস: হ্যাঁ! সেখানে দরকারী প্রচুর সংস্থান।
সেলভাম পলানিমালাই

8
এই আরও ভার্বোজ সিনট্যাক্স ব্যবহার না করে আপনি মিনিফিকেশন চালানোর আগে আপনি এনজিমন এবং একটি বিল্ড সরঞ্জাম (গ্রান্টের মতো) ব্যবহার করতে পারেন। এইভাবে আপনি সঠিকভাবে কমাতে পারেন তবে হয় নির্ভরতা ইনজেকশন সিনট্যাক্সও ব্যবহার করুন।
jkjustjoshing

4
মিনিফিকেশন সম্পর্কিত একটি নোট এখানে সরানো হয়েছে ডকস.আঙ্গুলারজেএস.অর্গ
টিউটোরিয়াল /


36

দ্বিতীয় বৈকল্পটি ব্যবহার করা নিরাপদ তবে এনজিমন দিয়ে নিরাপদে প্রথম বৈকল্পিকটি ব্যবহার করাও সম্ভব ।

আপডেট:
এখন এনজি-এনোটেট এই সমস্যাটি সমাধানের জন্য একটি নতুন ডিফল্ট সরঞ্জাম হয়ে উঠেছে।


7

হ্যাঁ, আপনাকে সুস্পষ্ট নির্ভরতা ইনজেকশন ব্যবহার করতে হবে (দ্বিতীয় বৈকল্পিক)। তবে কৌণিক 1.3.1 যেহেতু আপনি অন্তর্নিহিত নির্ভরতা ইনজেকশনটি বন্ধ করতে পারেন , এটি একবারে নামকরণ (সম্ভাব্যকরণের আগে) পুনরায় নামকরণের সাথে সম্ভাব্য সমস্যাগুলি সমাধান করা সত্যই সহায়ক।

strictDiকনফিগার সম্পত্তি ব্যবহার করে অন্তর্নিহিত ডিআই বন্ধ করে দেওয়া হচ্ছে :

angular.bootstrap(document, ['myApp'], {
    strictDi: true
});

ng-strict-diনির্দেশনা ব্যবহার করে অন্তর্নিহিত ডিআই বন্ধ করে দেওয়া :

<html ng-app="myApp" ng-strict-di>

7

আপনি যদি এটি ব্যবহার করেন তবে কেবল তা উল্লেখ করুন

ইঔম্যান্

ভালো লাগার দরকার নেই

var MyController = ['$scope', '$http', function($scope, $http) {
  $http.get('https://api.github.com/repos/angular/angular.js/commits')
    .then(function(response) {
      $scope.commits = response.data
    })
}]

কারণ মিনিফাইয়ের সময় গ্রান্ট ডিআই কে কীভাবে পরিচালনা করবেন তা বিবেচনা করে।


1

ওজেড_-এর মতোই বলা হয়েছে, সমস্ত কৌণিক জেএস ফাইলটি ডাইরেক্টিভ.জেএসএসএস.এসএস যেমন ছোট করতে এনজিমন ব্যবহার করুন। এর পরে আপনি এটি অপ্টিমাইজ করতে ক্লোজার সংকলকটি ব্যবহার করতে পারেন।

সুত্র:

অ্যাঙ্গুলারজ স্ক্রিপ্টগুলি কীভাবে ক্ষুদ্রতর করা যায়

YO দিয়ে তৈরি করুন


0

আপনি এখানে$inject এটি বর্ণিত হিসাবে ব্যবহার করতে চাইতে পারেন :

MyController.$inject = ['$scope', '$http'];

function MyController($scope, $http) {
  $http.get('https://api.github.com/repos/angular/angular.js/commits')
    .then(function(response) {
      $scope.commits = response.data
    })
}

0

সমস্যাগুলি নির্ণয়ের জন্য কঠোর নির্ভরতা ইনজেকশন ব্যবহার করুন

সঙ্গে অন্তর্নিহিত অ্যানোটেশন , কোড যখন minified ভঙ্গ করবে।

দস্তাবেজ থেকে:

অন্তর্নিহিত টিকা

যত্নবান: আপনি যদি নিজের কোডটি খাটো করার পরিকল্পনা করেন তবে আপনার পরিষেবার নামগুলি নাম পরিবর্তন করে আপনার অ্যাপ্লিকেশনটি ভেঙে দেবে।

আপনি কঠোর ডিআই মোডের বিকল্প ng-strict-diহিসাবে একই উপাদানটিতে একটি নির্দেশিকা যুক্ত ng-appকরতে পারেন।

<body ng-app="myApp" ng-strict-di>

যখনই কোনও পরিষেবা অন্তর্নিহিত টীকাগুলি ব্যবহার করার চেষ্টা করে তখন কঠোর মোড একটি ত্রুটি ছুড়ে দেয়।

সমস্যাগুলি নির্ধারণে এটি কার্যকর হতে পারে।

আরও তথ্যের জন্য, দেখুন

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