Понимание структуры папок Angular
Введение
Прежде чем приступить к работе, проверьте, установлены ли на вашем компьютере node, npm и angular, выполнив эти команды. Вот ссылка для начала работы с Angular.
Общие термины в Angular
Рабочее пространство содержит файлы для одного или нескольких проектов. Команда ng new создает рабочую область, она создает начальный каркас приложения на корневом уровне рабочей области.
Проект — это набор файлов, составляющих отдельное приложение или общую библиотеку.
Подпапкаsrc/
рабочей области содержит исходные файлы.
Файлы конфигурации рабочей области
.editorconfig
содержит конфигурацию для редакторов кода.
.gitignore
this файл указывает намеренно неотслеживаемые файлы, которые git должен игнорировать.
README.md
Вводная документация для корневого приложения. Вы можете добавить информацию о проекте, над которым вы работаете, для дальнейшего использования или помощи другим, которым потребуется работать с вашим кодом.
angular.json
он содержит параметры конфигурации CLI по умолчанию для всех проектов в рабочей области, включая параметры конфигурации для сборки, обслуживания и т. д.
package.json
it настраивает зависимости пакетов npm, которые доступны для всех проектов в рабочей области.
package-lock.json
it предоставляет информацию о версии для всех пакетов, установленных в node_modules
клиентом npm.
src/
это исходные файлы для проекта приложения корневого уровня.
node_modules/
it предоставляет npm-пакеты всему рабочему пространству. Зависимости node_modules
всей рабочей области видны всем проектам.
tsconfig.json
базовая конфигурация TypeScript для проектов в рабочей области.
tslint.json
конфигурация TSLint по умолчанию для проектов в рабочей области.
Файлы проекта приложения
После создания рабочей области, содержащей указанные выше файлы, мы используем команду ng generate
в командной строке, чтобы добавить функциональность и данные в приложение.
Исходные файлы приложения
app/
it содержит файлы компонентов, в которых определяется логика и данные вашего приложения.
assets/
it содержит изображения и другие файлы активов, которые будут скопированы как есть при создании приложения.
environments/
it содержит параметры конфигурации сборки для конкретных целевых сред.
favicon.ico
иконка для этого приложения на панели закладок.
index.html
основная HTML-страница, которая отображается при посещении вашего сайта. Интерфейс командной строки автоматически добавляет все файлы JavaScript и CSS при создании приложения, поэтому обычно вам не нужно добавлять здесь какие-либо теги <script>
или <link>
вручную.
main.ts
основная точка входа для вашего приложения. Компилирует приложение с помощью JIT-компилятора и загружает корневой модуль приложения (AppModule) для запуска в браузере.
polyfills.ts
it предоставляет сценарии полифилла для поддержки браузера.
styles.sass
перечисляет файлы CSS, которые предоставляют стили для проекта. Расширение отражает препроцессор стиля, который вы настроили для проекта.
test.ts
основная точка входа для ваших модульных тестов с некоторой специфичной для Angular конфигурацией. Обычно вам не нужно редактировать этот файл.
Папка приложения
Внутри папки src/
папка app/
содержит логику и данные вашего проекта. Здесь находятся компоненты, шаблоны и стили Angular.
app/app.component.ts
it определяет логику корневого компонента приложения с именем AppComponent
.
app/app.component.html
it определяет шаблон HTML, связанный с корнем AppComponent.
app/app.component.css
он определяет базовую таблицу стилей CSS для корня AppComponent
.
app/app.component.spec.ts
он определяет модульный тест для корня AppComponent
.
app/app.module.ts
он определяет корневой модуль с именем AppModule
, который сообщает Angular, как собрать приложение.
Другие специфичные для библиотеки файлы
Источник: Угловая документация
Удачного кодирования!!!!!!!!!!!!!!!!!!!