docs(core): code syntax typescript & image dimension (#4569)

This commit is contained in:
Benjamin Cabanes 2021-01-19 18:55:39 -05:00 committed by GitHub
parent aeec4bd4d9
commit 28aa63fcec
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 17 additions and 17 deletions

View File

@ -65,20 +65,20 @@ This step is very manual and varies widely based on the usage of features from v
- Bare spies - Bare spies
- Jasmine - Jasmine
```ts ```typescript
const myMock = jasmine.createSpy('myMock); const myMock = jasmine.createSpy('myMock);
``` ```
- Jest - Jest
```ts ```typescript
const myMock = jest.fn(); const myMock = jest.fn();
``` ```
- Spies on existing objects - Spies on existing objects
- Jasmine - Jasmine
```ts ```typescript
spyOn(foo, 'setBar'); spyOn(foo, 'setBar');
``` ```
- Jest - Jest
```ts ```typescript
jest.spyOn(foo, setBar); jest.spyOn(foo, setBar);
``` ```

View File

@ -92,7 +92,7 @@ Changing knobs in the url query parameters allows your Cypress tests to test dif
**\*.component.stories.ts file** **\*.component.stories.ts file**
```ts ```typescript
import { text, number } from '@storybook/addon-knobs'; import { text, number } from '@storybook/addon-knobs';
import { ButtonComponent } from './button.component'; import { ButtonComponent } from './button.component';
@ -115,7 +115,7 @@ export const primary = () => ({
**Cypress \*.spec.ts file** **Cypress \*.spec.ts file**
```ts ```typescript
describe('shared-ui', () => { describe('shared-ui', () => {
beforeEach(() => beforeEach(() =>
cy.visit( cy.visit(

Binary file not shown.

Before

Width:  |  Height:  |  Size: 109 KiB

After

Width:  |  Height:  |  Size: 45 KiB

View File

@ -83,7 +83,7 @@ Changing knobs in the url query parameters allows your Cypress tests to test dif
**\*.stories.tsx file** **\*.stories.tsx file**
```ts ```typescript
import React from 'react'; import React from 'react';
import { text, number } from '@storybook/addon-knobs'; import { text, number } from '@storybook/addon-knobs';
import { Button } from './button'; import { Button } from './button';
@ -97,7 +97,7 @@ export const primary = () => (
**Cypress \*.spec.ts file** **Cypress \*.spec.ts file**
```ts ```typescript
describe('shared-ui', () => { describe('shared-ui', () => {
beforeEach(() => beforeEach(() =>
cy.visit( cy.visit(

View File

@ -208,7 +208,7 @@ nx generate lib ui-button
The new library can be used in your app like by adding this code to `App.tsx`: The new library can be used in your app like by adding this code to `App.tsx`:
```tsx ```typescriptx
//... //...
import { UiButton } from '@acme/ui-button'; import { UiButton } from '@acme/ui-button';
//... //...

View File

@ -51,7 +51,7 @@ In our `impl.ts` file, we're creating an `Options` interface that matches the js
The `impl.ts` contains the actual code for your builder. Your builder should use the `createBuilder` function of the `@angular-devkit/architect` package to create a builder that can be run via the Nx CLI tools. The `impl.ts` contains the actual code for your builder. Your builder should use the `createBuilder` function of the `@angular-devkit/architect` package to create a builder that can be run via the Nx CLI tools.
```ts ```typescript
import { BuilderOutput, createBuilder } from '@angular-devkit/architect'; import { BuilderOutput, createBuilder } from '@angular-devkit/architect';
import * as childProcess from 'child_process'; import * as childProcess from 'child_process';
import { Observable } from 'rxjs'; import { Observable } from 'rxjs';
@ -89,7 +89,7 @@ Part of the power of the architect API is the ability to compose builders via ex
Here's an example of this (from a hypothetical project), that will serve an api (project name: "api") in watch mode, then serve a frontend app (project name: "web-client") in watch mode: Here's an example of this (from a hypothetical project), that will serve an api (project name: "api") in watch mode, then serve a frontend app (project name: "web-client") in watch mode:
```ts ```typescript
import { import {
BuilderContext, BuilderContext,
BuilderOutput, BuilderOutput,
@ -178,7 +178,7 @@ The first difference to adjust is to mark the executor as an Nx Executor in the
Your executor's implementation must consist of a function that takes an options object and returns a `Promise<{ success: boolean }>`. Given the echo implementation provided in the Angular Devkit Builder section above, our Nx executor would look like this: Your executor's implementation must consist of a function that takes an options object and returns a `Promise<{ success: boolean }>`. Given the echo implementation provided in the Angular Devkit Builder section above, our Nx executor would look like this:
```ts ```typescript
import * as childProcess from 'child_process'; import * as childProcess from 'child_process';
interface Options { interface Options {

View File

@ -31,7 +31,7 @@ The `schema.json` provides a description of the generator, available options, va
The initial generator function creates a library. The initial generator function creates a library.
```ts ```typescript
import { Tree, formatFiles, installPackagesTask } from '@nrwl/devkit'; import { Tree, formatFiles, installPackagesTask } from '@nrwl/devkit';
import { libraryGenerator } from '@nrwl/workspace'; import { libraryGenerator } from '@nrwl/workspace';
@ -117,7 +117,7 @@ happynrwl/
Next, update the `index.ts` file for the schematic, and create different rules for generating a library, and generating the new files. Both rules have access to the available options provided for the schematic. Next, update the `index.ts` file for the schematic, and create different rules for generating a library, and generating the new files. Both rules have access to the available options provided for the schematic.
```ts ```typescript
import { import {
apply, apply,
chain, chain,
@ -195,7 +195,7 @@ UPDATE package.json (1959 bytes)
To create a TypeScript schema to use in your generator function, define a TypeScript file next to your schema.json named schema.ts. Inside the schema.ts, define an interface to match the properties in your schema.json file, and whether they are required. To create a TypeScript schema to use in your generator function, define a TypeScript file next to your schema.json named schema.ts. Inside the schema.ts, define an interface to match the properties in your schema.json file, and whether they are required.
```ts ```typescript
export interface SchematicOptions { export interface SchematicOptions {
name: string; name: string;
type?: string; type?: string;
@ -204,7 +204,7 @@ export interface SchematicOptions {
Import the TypeScript schema into your generator file and replace the any in your generator function with the interface. Import the TypeScript schema into your generator file and replace the any in your generator function with the interface.
```ts ```typescript
import { Tree, formatFiles, installPackagesTask } from '@nrwl/devkit'; import { Tree, formatFiles, installPackagesTask } from '@nrwl/devkit';
import { libraryGenerator } from '@nrwl/workspace'; import { libraryGenerator } from '@nrwl/workspace';

View File

@ -97,7 +97,7 @@ A utility library can depend only on utility libraries.
An example ui lib module: **libs/shared/util-formatting** An example ui lib module: **libs/shared/util-formatting**
```ts ```typescript
export { formatDate, formatTime } from './src/format-date-fns'; export { formatDate, formatTime } from './src/format-date-fns';
export { formatCurrency } from './src/format-currency'; export { formatCurrency } from './src/format-currency';
``` ```