Anatomy of the Setup Project

The documentation setup procedures install a lot of files. Most of them can be safely ignored.

Application files inside the src/ and e2e/ folders matter most to developers.

Files outside those folders condition the development environment. They rarely change and you may never view or modify them. If you do, this page can help you understand their purpose.

File Purpose
src/app/

Angular application files go here.

Ships with the "Hello Angular" sample's AppComponent, AppModule, a component unit test (app.component.spec.ts), and the bootstrap file, main.ts.

Try the sample application and the unit test as live examples.

e2e/

End-to-end (e2e) tests of the application, written in Jasmine and run by the protractor e2e test runner.

Initialized with an e2e test for the "Hello Angular" sample.

node_modules/

The npm packages installed with the npm install command.

.editorconfig .git/ .gitignore .travis.yml

Tooling configuration files and folders. Ignore them until you have a compelling reason to do otherwise.

CHANGELOG.md

The history of changes to the QuickStart repository. Delete or ignore.

favicon.ico

The application icon that appears in the browser tab.

index.html

The application host page. It loads a few essential scripts in a prescribed order. Then it boots the application, placing the root AppComponent in the custom <my-app> body tag.

The same index.html satisfies all documentation application samples.

karma.conf.js

Configuration for the karma test runner described in the Testing guide.

karma-test-shim.js

Script to run karma with SystemJS as described in the Testing guide.

non-essential-files.txt

A list of files that you can delete if you want to purge your setup of the original QuickStart Seed testing and git maintenance artifacts. See instructions in the optional Deleting non-essential files section. Do this only in the beginning to avoid accidentally deleting your own tests and git setup!

LICENSE

The open source MIT license to use this setup code in your application.

package.json

Identifies npmpackage dependencies for the project.

Contains command scripts for running the application, running tests, and more. Enter npm run for a listing. Read more about them.

protractor.config.js

Configuration for the protractor end-to-end (e2e) test runner.

README.md

Instruction for using this git repository in your project. Worth reading before deleting.

styles.css

Global styles for the application. Initialized with an <h1> style for the QuickStart demo.

systemjs.config.js

Tells the SystemJS module loader where to find modules referenced in JavaScript import statements. For example:

import { Component } from '@angular/core;

Don't touch this file unless you are fully versed in SystemJS configuration.

systemjs.config.extras.js

Optional extra SystemJS configuration. A way to add SystemJS mappings, such as for application barrels, without changing the original system.config.js.

tsconfig.json

Tells the TypeScript compiler how to transpile TypeScript source files into JavaScript files that run in all modern browsers.

tslint.json

The npm installed TypeScript linter inspects your TypeScript code and complains when you violate one of its rules.

This file defines linting rules favored by the Angular style guide and by the authors of the documentation.

© 2010–2017 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v4.angular.io/guide/setup-systemjs-anatomy