<commit_before>## Create the component in /src

```
$ ng g module lol -a=src
installing module
  create src\app\lol\lol.module.ts
$ ng g component lol -a=src --export=true
installing component
  create src\app\lol\lol.component.scss
  create src\app\lol\lol.component.html
  create src\app\lol\lol.component.spec.ts
  create src\app\lol\lol.component.ts
  update src\app\lol\lol.module.ts
```

> - `-a=src` tells ng-cli to use application src, so it will generate everything in `/src/app/...`. by default it will use the demo application so you have to specify if you want to create something in `/src`
> - always generate the module first, that way you have a module for our new component
> - `--export=true` tells ng-cli to make the declaring module (here `LuLolModule`) to also export the component
don't forget to update the generated classes to add the prefix `Lu`: `LolModule` -> `LuLolModule`. it wll prevent conflicts for applications using the lib

### Necessary exports

`lol.module.ts` will be the entry point for imports and exports of your new component, so add this line

```ts
@NgModule({...})
export class LuLolModule { }
export { LuLolComponent } from './lol.component'; //this line
```

you need to add your module to the [LuRootModule](https://github.com/LuccaSA/lucca-front/blob/master/packages/ng/src/app/lu-root.module.ts)

```ts
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { LuLolModule } from './lol/lol.module'; // add here

@NgModule({
	imports: [
		CommonModule,
		LuLolModule, // and here
	],
})
export class LuRootModule { }
```

also you need to export the `LuLolModule` and `LuLolComponent` in the file `/src/index.ts` because its the entry point for the publish library

```ts
export * from './app/lol/lol.module';
// or specifically
// export { LuLolModule, LuLolComponent } from './app/lol/lol.module';
export { LuRootModule } from './app/lu-root.module';
```

### inline documentation

there's a script that i copied from [ng-bootstrap](https://ng-bootstrap.github.io) to generate documentation from the code. It can parse inline documentation so it would be highly appreciated if you document your component's input and putput

```ts<commit_msg>ng - update step by step<commit_after>## Create the component in /src

```
$ ng g module lol -a=src
installing module
  create src\app\lol\lol.module.ts
$ ng g component lol -a=src --export=true
installing component
  create src\app\lol\lol.component.scss
  create src\app\lol\lol.component.html
  create src\app\lol\lol.component.spec.ts
  create src\app\lol\lol.component.ts
  update src\app\lol\lol.module.ts
```

> - `-a=src` tells ng-cli to use application src, so it will generate everything in `/src/app/...`. by default it will use the demo application so you have to specify if you want to create something in `/src`
> - always generate the module first, that way you have a module for our new component
> - `--export=true` tells ng-cli to make the declaring module (here `LuLolModule`) to also export the component
don't forget to update the generated classes to add the prefix `Lu`: `LolModule` -> `LuLolModule`. it wll prevent conflicts for applications using the lib

### Necessary exports

`lol.module.ts` will be the entry point for imports and exports of your new component, so add this line

```ts
@NgModule({...})
export class LuLolModule { }
export { LuLolComponent } from './lol.component'; //this line
```

you need to add your module to the [LuRootModule](https://github.com/LuccaSA/lucca-front/blob/master/packages/ng/src/app/lu-root.module.ts) and make it export the `LuLolModule`

```ts
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { LuLolModule } from './lol/lol.module'; // add here

@NgModule({
	imports: [
		CommonModule,
		LuLolModule, // and here
	],
	export: [
		LuLolModule, //and here
	],
})
export class LuRootModule { }
```

also you need to export the `LuLolModule` and `LuLolComponent` in the file `/src/index.ts` because its the entry point for the publish library

```ts
export * from './app/lol/lol.module';
// or specifically
// export { LuLolModule, LuLolComponent } from './app/lol/lol.module';
export { LuRootModule } from './app/lu-root.module';
```

### inline documentation

there's a script that i copied from [ng-bootstrap](https://ng-bootstrap.github.io) to generate documentation from the code. It can parse inline documentation so it would be highly appreciated if you document your component's input and putput

```ts
{'fraction_non_alphanumeric': 0.11981566820276497, 'fraction_numerical': 0.0, 'mean_word_length': 3.9597388465723613, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 11, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2822742', 'n_tokens_mistral': 1440, 'n_tokens_neox': 1404, 'n_words': 529}