From becb7a87e0ca710352391300bb6cb46aef628335 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Wed, 29 Mar 2017 20:13:33 +0200 Subject: [PATCH] build: tsconfig for editor warnings (#3791) * build: tsconfig for editor warnings Currently when using a code editor that uses the TypeScript language service (Webstorm / VS Code / Atom / Sublime) there will be TypeScript errors in the `.spec` files. This is because the editor finds the `tsconfig.json` file that doesn't match the spec files. Therefore it complains about the `experimentalDecorators`. In `angular/angular` there is a global `tsconfig` file that matches everything and is therefore fixing the editor warnings. This file is also used to compile all `.spec` files for the whole project. We can add such a `tsconfig.json` file as well, and in the future we can use it for compiling the specs as well. * Add docs for tsconfig files --- e2e/tsconfig.json | 2 ++ src/demo-app/tsconfig-aot.json | 6 ++++-- .../{tsconfig.json => tsconfig-build.json} | 2 ++ .../{tsconfig.json => tsconfig-build.json} | 2 ++ src/lib/{tsconfig.json => tsconfig-build.json} | 2 ++ src/lib/tsconfig-specs.json | 5 ++++- src/tsconfig.json | 15 +++++++++++++++ tools/gulp/tasks/development.ts | 2 +- tools/gulp/tasks/e2e.ts | 2 +- tools/gulp/tasks/library.ts | 2 +- tools/gulp/tsconfig.json | 2 ++ 11 files changed, 36 insertions(+), 6 deletions(-) rename src/demo-app/{tsconfig.json => tsconfig-build.json} (82%) rename src/e2e-app/{tsconfig.json => tsconfig-build.json} (79%) rename src/lib/{tsconfig.json => tsconfig-build.json} (80%) create mode 100644 src/tsconfig.json diff --git a/e2e/tsconfig.json b/e2e/tsconfig.json index a4130cff60a..53ea134f069 100644 --- a/e2e/tsconfig.json +++ b/e2e/tsconfig.json @@ -1,3 +1,5 @@ +// TypeScript config that is used to build the e2e spec files. Protractor will use TS-Node to +// compile the e2e/ folder at runtime. { "compilerOptions": { "declaration": true, diff --git a/src/demo-app/tsconfig-aot.json b/src/demo-app/tsconfig-aot.json index c2ad1d498dc..eadf8e0b252 100644 --- a/src/demo-app/tsconfig-aot.json +++ b/src/demo-app/tsconfig-aot.json @@ -1,6 +1,8 @@ -/* Config file for the Angular Compiler. Paths need to be relative to the dist folder. */ +// TypeScript config that extends the demo-app tsconfig file. This config compiles the +// "main-aot.ts" file and also enables templage code generation / AOT. All paths need +// to be relative to the output directory. { - "extends": "./tsconfig", + "extends": "./tsconfig-build", "compilerOptions": { "experimentalDecorators": true, "paths": { diff --git a/src/demo-app/tsconfig.json b/src/demo-app/tsconfig-build.json similarity index 82% rename from src/demo-app/tsconfig.json rename to src/demo-app/tsconfig-build.json index 7b70b021201..224f8b102c1 100644 --- a/src/demo-app/tsconfig.json +++ b/src/demo-app/tsconfig-build.json @@ -1,3 +1,5 @@ +// TypeScript config file that is used to compile the demo-app. Target environment will be ES5, +// since the demo-app will be served in the browser. { "compilerOptions": { "declaration": false, diff --git a/src/e2e-app/tsconfig.json b/src/e2e-app/tsconfig-build.json similarity index 79% rename from src/e2e-app/tsconfig.json rename to src/e2e-app/tsconfig-build.json index 637f489bd75..b640a7213c8 100644 --- a/src/e2e-app/tsconfig.json +++ b/src/e2e-app/tsconfig-build.json @@ -1,3 +1,5 @@ +// TypeScript config file that is used to compile the e2e-app. Protractor will run all specs +// against the e2e-app in the browser and therefore the code needs to be ES5 compatible. { "compilerOptions": { "declaration": true, diff --git a/src/lib/tsconfig.json b/src/lib/tsconfig-build.json similarity index 80% rename from src/lib/tsconfig.json rename to src/lib/tsconfig-build.json index 67ebfc7d9f8..4819e397262 100644 --- a/src/lib/tsconfig.json +++ b/src/lib/tsconfig-build.json @@ -1,3 +1,5 @@ +// TypeScript config file that is used to compile the library. Target environment needs to be +// ES2015 since the build process will create FESM bundles using rollup. { "compilerOptions": { "baseUrl": ".", diff --git a/src/lib/tsconfig-specs.json b/src/lib/tsconfig-specs.json index c0bfeb60ea4..c84a07778ea 100644 --- a/src/lib/tsconfig-specs.json +++ b/src/lib/tsconfig-specs.json @@ -1,5 +1,8 @@ +// TypeScript config file that extends the default tsconfig file for the library. This config is +// used to compile the specs for Karma. Since the code will run inside of the browser, the target +// needs to be ES5. The format needs to be CommonJS since Karma only supports that module format. { - "extends": "./tsconfig", + "extends": "./tsconfig-build", "compilerOptions": { "module": "commonjs", "target": "es5", diff --git a/src/tsconfig.json b/src/tsconfig.json new file mode 100644 index 00000000000..9f199f2cf4a --- /dev/null +++ b/src/tsconfig.json @@ -0,0 +1,15 @@ +// TypeScript config file that matches all source files in the project. This file is read by +// IDEs and ensures that `experimentalDecorator` warnings are not showing up. +{ + "compilerOptions": { + "experimentalDecorators": true, + "module": "es2015", + "moduleResolution": "node", + "outDir": "../../dist/packages/all", + "sourceMap": true, + "inlineSources": true, + "target": "es2015", + "lib": ["es2015", "dom"], + "types": ["jasmine"] + } +} diff --git a/tools/gulp/tasks/development.ts b/tools/gulp/tasks/development.ts index fc4636f1a6f..316905617bf 100644 --- a/tools/gulp/tasks/development.ts +++ b/tools/gulp/tasks/development.ts @@ -16,7 +16,7 @@ task(':watch:devapp', () => { }); /** Path to the demo-app tsconfig file. */ -const tsconfigPath = join(appDir, 'tsconfig.json'); +const tsconfigPath = join(appDir, 'tsconfig-build.json'); task(':build:devapp:ts', tsBuildTask(tsconfigPath)); task(':build:devapp:scss', sassBuildTask(outDir, appDir)); diff --git a/tools/gulp/tasks/e2e.ts b/tools/gulp/tasks/e2e.ts index f84859244dd..ea94fad9071 100644 --- a/tools/gulp/tasks/e2e.ts +++ b/tools/gulp/tasks/e2e.ts @@ -13,7 +13,7 @@ const appDir = path.join(SOURCE_ROOT, 'e2e-app'); const outDir = DIST_E2EAPP; const PROTRACTOR_CONFIG_PATH = path.join(PROJECT_ROOT, 'test/protractor.conf.js'); -const tsconfigPath = path.join(appDir, 'tsconfig.json'); +const tsconfigPath = path.join(appDir, 'tsconfig-build.json'); task(':watch:e2eapp', () => { watch(path.join(appDir, '**/*.ts'), [':build:e2eapp:ts']); diff --git a/tools/gulp/tasks/library.ts b/tools/gulp/tasks/library.ts index 2de4da5c29d..e46f8d4d9e5 100644 --- a/tools/gulp/tasks/library.ts +++ b/tools/gulp/tasks/library.ts @@ -13,7 +13,7 @@ const inlineResources = require('../../../scripts/release/inline-resources'); const uglify = require('uglify-js'); const libraryRoot = join(SOURCE_ROOT, 'lib'); -const tsconfigPath = join(libraryRoot, 'tsconfig.json'); +const tsconfigPath = join(libraryRoot, 'tsconfig-build.json'); // Paths to the different output directories. const materialDir = DIST_MATERIAL; diff --git a/tools/gulp/tsconfig.json b/tools/gulp/tsconfig.json index 50414a019e5..ab9b9a6c602 100644 --- a/tools/gulp/tsconfig.json +++ b/tools/gulp/tsconfig.json @@ -1,3 +1,5 @@ +// TypeScript config file that will be used to compile the gulp tasks. The normal gulpfile will +// use TS-Node to compile the gulp tasks at runtime. { "compilerOptions": { "experimentalDecorators": true,