От автора: в этой главе мы рассмотрим другие файлы конфигурации, Angular JSON, которые являются частью проекта.
tsconfig.json
Этот файл используется для предоставления опций TypeScript, используемых для проекта Angular JS.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
{ "compilerOptions": { "target": "es5", "module": "commonjs", "moduleResolution": "node", "sourceMap": true, "emitDecoratorMetadata": true, "experimentalDecorators": true, "lib": [ "es2015", "dom" ], "noImplicitAny": true, "suppressImplicitAnyIndexErrors": true } } |
Ниже приведены некоторые ключевые моменты, которые следует отметить в отношении вышеуказанного кода.
Целью компиляции является es5, и это связано с тем, что большинство браузеров могут понимать только ES5 typescript.
Параметр sourceMap используется для создания файлов Map, которые применяются при отладке. Следовательно, во время разработки рекомендуется устанавливать для этой опции значение true.
Для декораторов Angular JS требуется установить «emitDecoratorMetadata»: true и «experimentalDecorators»: true.
Без этого приложение Angular JS не будет компилироваться.
package.json
Этот файл содержит информацию о проекте Angular 2. Ниже приведены стандартные настройки этого файла.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 |
{ "name": "angular-quickstart", "version": "1.0.0", "description": "QuickStart package.json from the documentation, supplemented with testing support", "scripts": { "build": "tsc -p src/", "build:watch": "tsc -p src/ -w", "build:e2e": "tsc -p e2e/", "serve": "lite-server -c=bs-config.json", "serve:e2e": "lite-server -c=bs-config.e2e.json", "prestart": "npm run build", "start": "concurrently \"npm run build:watch\" \"npm run serve\"", "pree2e": "npm run build:e2e", "e2e": "concurrently \"npm run serve:e2e\" \"npm run protractor\" --killothers --success first", "preprotractor": "webdriver-manager update", "protractor": "protractor protractor.config.js", "pretest": "npm run build", "test": "concurrently \"npm run build:watch\" \"karma start karma.conf.js\"", "pretest:once": "npm run build", "test:once": "karma start karma.conf.js --single-run", "lint": "tslint ./src/**/*.ts -t verbose" }, "keywords": [], "author": "", "license": "MIT", "dependencies": { "@angular/common": "~2.4.0", "@angular/compiler": "~2.4.0", "@angular/core": "~2.4.0", "@angular/forms": "~2.4.0", "@angular/http": "~2.4.0", "@angular/platform-browser": "~2.4.0", "@angular/platform-browser-dynamic": "~2.4.0", "@angular/router": "~3.4.0", "angular-in-memory-web-api": "~0.2.4", "systemjs": "0.19.40", "core-js": "^2.4.1", "rxjs": "5.0.1", "zone.js": "^0.7.4" }, "devDependencies": { "concurrently": "^3.2.0", "lite-server": "^2.2.2", "typescript": "~2.0.10", "canonical-path": "0.0.2", "tslint": "^3.15.1", "lodash": "^4.16.4", "jasmine-core": "~2.4.1", "karma": "^1.3.0", "karma-chrome-launcher": "^2.0.0", "karma-cli": "^1.0.1", "karma-jasmine": "^1.0.2", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~4.0.14", "rimraf": "^2.5.4", "@types/node": "^6.0.46", "@types/jasmine": "2.5.36" }, "repository": {} } |
В этом коде следует отметить следующее —
Существует два типа зависимостей: обычные зависимости и зависимости разработки. Последние требуются для процесса разработки, в то время, как стандартные зависимости нужны для запуска приложения.
Команда «build:watch»: «tsc -p src/ -w» используется для компиляции текста в фоновом режиме путем поиска изменений в файлах typescript.
systemjs.config.json
Этот файл содержит системные файлы, необходимые для приложения Angular JS. Он добавляет все требуемые файлы скриптов без необходимости добавлять тег script в html-код страницы. Стандартные файлы содержат следующий код.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
/** * Системные настройки для экземпляров Angular * Данные настройки задаются в соответствии с потребностями конкретного приложения */ (function (global) { System.config ({ paths: { // пути используются в качестве алиасов 'npm:': 'node_modules/' }, // map указывает загрузчику системы, где располагаются соответствующие элементы map: { // приложение размещается в папке app app: 'app', // пакеты angular '@angular/core': 'npm:@angular/core/bundles/core.umd.js', '@angular/common': 'npm:@angular/common/bundles/common.umd.js', '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js', '@angular/platform-browser': 'npm:@angular/platformbrowser/bundles/platform-browser.umd.js', '@angular/platform-browser-dynamic': 'npm:@angular/platform-browserdynamic/bundles/platform-browser-dynamic.umd.js', '@angular/http': 'npm:@angular/http/bundles/http.umd.js', '@angular/router': 'npm:@angular/router/bundles/router.umd.js', '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js', // другие библиотеки 'rxjs': 'npm:rxjs', 'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/inmemory-web-api.umd.js' }, // пакеты указывают загрузчику системы, что загружать если отсутствует имя файла and/or no extension packages: { app: { defaultExtension: 'js' }, rxjs: { defaultExtension: 'js' } } }); })(this); |
В данном коде нужно отметить следующее —
‘npm:’: ‘node_modules/’ указывает место, где расположены все модули npm.
Указание места ‘app’ задает папку, в которую загружаются все файлы приложений.
Источник: //www.tutorialspoint.com/
Редакция: Команда webformyself.
