Блог

например, если мой оператор импорта имеет

 import { AfterViewInit, Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
  

итак, может ли кто-нибудь помочь мне с какой-либо статьей, содержащей информацию о их написании или
предложите, чтобы в правильном порядке, например, после того, как компонент AfterViewInit должен быть написан следующим образом

пожалуйста, помогите мне изучить лучшие практики

я пробовал в stack over flow и на других сайтах, но не смог получить ответ

 import { AfterViewInit, Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
  

мне нужно официальное руководство с любого сайта, чтобы указать правильный порядок

Согласно официальному руководству по стилю Angular, строки импорта внутри компонентов должны быть расположены в алфавитном порядке, а символы деструктурированного импорта также должны быть расположены в алфавитном порядке. Это действительно помогло бы с точки зрения удобства чтения и расположения импортированных модулей.

Вы можете прочитать больше об этом конкретном правиле здесь.

Из вашего примера,

 import { AfterViewInit, Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
  

Это абсолютно нормально, и это соответствует тому, что упоминается в руководстве по стилю. Вы должны стандартизировать это правило с остальными участниками вашего проекта!

Вот еще один пример. Если вы хотите импортировать FormBuilder и FormControl в свой компонент, он должен перейти к следующей строке, поскольку ‘F’ находится после ‘A’.

 import { AfterViewInit, Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
import { FormBuilder, FormControl } from '@angular/forms';
  

Тем не менее, вы должны оставить пустую строку, чтобы отделить ваш сторонний импорт от вашего «собственного» импорта приложений.

 import { AfterViewInit, Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
import { FormBuilder, FormControl } from '@angular/forms';

import { Hero } from './hero.model';
  

При работе над проектом (будь то личным или совместным) часто бывает, что создается руководство по стилю, чтобы можно было убрать эти аспекты «предварительных вкусов», и каждый мог сосредоточиться на важной части проекта (т. Е. На коде). Со временем мы разработали программы, которые формализуют эти стили с помощью инструментов статического анализа, таких как linters. В случае ES примером может быть это правило eslint, которое диктует, что импорт должен быть отсортирован.

Вы можете прочитать больше об eslint здесь. Ключевые слова, которые вы ищете, — это «руководство по стилю», «компоновка», «непрерывная интеграция» (если вы хотите, чтобы github отправлял вам электронное письмо / отклонял запросы на слияние, если отправленный код не соответствует руководству по стилю).

Официальные рекомендации см. в другом ответе.