Angular - это фреймворк. Вы можете создать практически любое приложение без использования сторонних библиотек.
В результате, типы и организация файлов в некоторой степени предопределены функциональностью. Компоненты, директивы, службы... и т.д. Наличие стандарта означает, что создание файлов в некоторой степени функционально.
Это функция, предоставляемая Angular CLI (@angular/cli), которая помогает вам написать код, необходимый для создания определенных типов файлов.
Например, есть код, необходимый для создания файла компонента.
import { Component } from '@angular/core'; @Component({ selector: 'app-textbox', template: '<input type="text"></input>', styles: ['input { font-weight: bold; }'], }) export class TextboxComponent {}
Для простого компонента, который отображает элемент ввода типа text, не нужно писать много кода.
Angular CLI напишет большую часть кода за вас.
# textbox 라는 이름의 컴포넌트 생성 # --inline-template 옵션을 사용하면 html 파일을 따로 생성하지 않는다 # --inline-style 옵션을 사용하면 css 파일을 따로 생성하지 않는다 ng generate component textbox --inline-template --inline-style # 축약 버전도 있다 ng g c textbox --inline-style --inline-template
Выполнение приведенной выше команды создаст файл, подобный приведенному ниже.
import { Component } from '@angular/core'; @Component({ selector: 'app-textbox', template: '', styles: [''], }) export class TextboxComponent {}
Вы можете видеть, что большая часть кода уже написана, за исключением тех частей, которые вам нужно написать самостоятельно. Если вы хотите узнать больше, ознакомьтесь с официальной документацией 🔁.
Хотя это отличная функция, есть некоторые вещи, которые лично мне показались недостаточно хорошими, поэтому я их улучшил.
Существует два способа задать путь создания файла.
Лично мне оба варианта показались громоздкими. Было бы неплохо иметь возможность просто запустить команду и выбрать из списка местоположение, которое я хочу создать.
? Ng 모듈 apps/src/app.module.ts > apps/src/modules/.../feat.module.ts apps/src/modules/.../feat2.module.ts
Причина, по которой мне удалось это сделать, заключается в том, что я установил соглашение о местоположении создания файла. Как упоминалось выше, Angular имеет определенную конфигурацию для типов файлов, поэтому было несложно установить соглашение для создания файлов.
В целом, Angular управляет файлами по модулю , поэтому мы могли бы определить место создания файла, выбрав модуль для создания файла.
Например, добавление файла компонента в модуль feat.module.ts создаст файл в папке feat.module.ts/components.
Это личное предпочтение, но я не нахожу удобным вводить опции непосредственно в терминал. Конечно, вы можете указать параметры по умолчанию , но это не меняет того факта, что вам придется вводить их, если вы не хотите использовать одни и те же параметры каждый раз.
Я нашел gatsby-cli хороший способ указать опции, поэтому я позаимствовал его. Когда вы запускаете команду, она последовательно предлагает пользователю ввести или выбрать параметр.
? prefix (app) ___
Он принимает текстовый ввод
Или выбор вариантов.
Поскольку я работал над улучшением существующей функции, мне приходилось часто обращаться к кодовой базе Angular CLI, и я думаю, что многое почерпнул из нее. Я хотел бы копнуть глубже, когда у меня будет больше времени.
Я думаю, что нелегко стремиться к определенной форме или конвенции, потому что у открытого исходного кода много пользователей, поэтому я думаю, что было бы неплохо улучшить его в соответствии с ситуацией каждой организации.
20.08.2023 18:21
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в 2023-2024 годах? Или это полная лажа?".
20.08.2023 17:46
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
19.08.2023 18:39
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в частности, магию поплавков и гибкость flexbox.
19.08.2023 17:22
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для чтения благодаря своей простоте. Кроме того, мы всегда хотим проверить самые последние возможности в наших проектах!
18.08.2023 20:33
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий их языку и культуре.
14.08.2023 14:49
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип предназначен для представления неделимого значения.