diff --git a/aio/content/examples/ajs-quick-reference/.angular-cli.1.json b/aio/content/examples/ajs-quick-reference/.angular-cli.1.json new file mode 100644 index 0000000000..d4a67ca369 --- /dev/null +++ b/aio/content/examples/ajs-quick-reference/.angular-cli.1.json @@ -0,0 +1,62 @@ +{ + "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "project": { + "name": "angular.io-example" + }, + "apps": [ + { + "root": "src", + "outDir": "dist", + "assets": [ + "assets", + "favicon.ico" + ], + "index": "index.html", + "main": "main.ts", + "polyfills": "polyfills.ts", + "test": "test.ts", + "tsconfig": "tsconfig.app.json", + "testTsconfig": "tsconfig.spec.json", + "prefix": "app", + // #docregion styles + "styles": [ + "styles.css" + ], + // #enddocregion styles + "scripts": [], + "environmentSource": "environments/environment.ts", + "environments": { + "dev": "environments/environment.ts", + "prod": "environments/environment.prod.ts" + } + } + ], + "e2e": { + "protractor": { + "config": "./protractor.conf.js" + } + }, + "lint": [ + { + "project": "src/tsconfig.app.json", + "exclude": "**/node_modules/**" + }, + { + "project": "src/tsconfig.spec.json", + "exclude": "**/node_modules/**" + }, + { + "project": "e2e/tsconfig.e2e.json", + "exclude": "**/node_modules/**" + } + ], + "test": { + "karma": { + "config": "./karma.conf.js" + } + }, + "defaults": { + "styleExt": "css", + "component": {} + } +} diff --git a/aio/content/examples/ajs-quick-reference/src/index.html b/aio/content/examples/ajs-quick-reference/src/index.html index 9f786cb6aa..5aafc885c9 100644 --- a/aio/content/examples/ajs-quick-reference/src/index.html +++ b/aio/content/examples/ajs-quick-reference/src/index.html @@ -5,9 +5,6 @@ AngularJS to Angular Quick Reference - - - diff --git a/aio/content/guide/ajs-quick-reference.md b/aio/content/guide/ajs-quick-reference.md index f6eaaca4fc..2a345c9b1e 100644 --- a/aio/content/guide/ajs-quick-reference.md +++ b/aio/content/guide/ajs-quick-reference.md @@ -212,8 +212,6 @@ The following are some of the key AngularJS built-in directives and their equiva To launch the app in code, explicitly bootstrap the application's root module (`AppModule`) in `main.ts` and the application's root component (`AppComponent`) in `app.module.ts`. - - For more information see the [Setup](guide/setup) page. @@ -1254,13 +1252,12 @@ also encapsulate a style sheet within a specific component. - ### Link tag - + ### Styles configuration + - - In Angular, you can continue to use the link tag to define the styles for your application in the `index.html` file. - But now you can also encapsulate styles for your components. + With the Angular CLI, you can configure your global styles in the `.angular-cli.json` file. + You can rename the extension to `.scss` to use sass. ### StyleUrls In Angular, you can use the `styles` or `styleUrls` property of the `@Component` metadata to define