Feature workflow

A feature delivers a cohesive set of functionality focused on a specific application need such as a user workflow, routing, or forms.

• Feature library generator options

• Generate a feature library

Feature library location: /libs/features/{{feature name}}

Do generate a feature library if the set of functionality represents a view or route

Do generate a feature library if functionality includes state management

Feature library generator options

Run the below command to view all library options.

nx g lib --help

Library options reference: https://nx.dev/packages/angular/generators/library

From:  @nrwl/angular (v15.8.1)
Name:  library (aliases: lib)


  Creates an Angular library.


Options:
    --name                       The name of the library.                                                      [string]
    --buildable                  Generate a buildable library.                                                [boolean]
    --directory                  A directory where the library is placed.                                      [string]
    --lazy                       Add `RouterModule.forChild` when set to                                      [boolean]
                                 true, and a simple array of routes when set
                                 to false.
    --parent                     Path to the parent route configuration                                        [string]
                                 using `loadChildren` or `children`,
                                 depending on what `lazy` is set to.
    --publishable                Generate a publishable library.                                              [boolean]
    --routing                    Add router configuration. See `lazy` for                                     [boolean]
                                 more information.
    --addModuleSpec              Add a module spec file.                                                      [boolean]
    --addTailwind                Whether to configure Tailwind CSS for the                                    [boolean]
                                 application. It can only be used with
                                 buildable and publishable libraries.
                                 Non-buildable libraries will use the
                                 application's Tailwind configuration.
    --changeDetection, -c        The change detection strategy to use in the    [string] [choices: "Default", "OnPush"]
                                 new component. Disclaimer: This option is                         [default: "Default"]
                                 only valid when `--standalone` is set to
                                 `true`. _Note: This is only supported in
                                 Angular versions >= 14.1.0_
    --compilationMode            Specifies the compilation mode to use. If        [string] [choices: "full", "partial"]
                                 not specified, it will default to `partial`
                                 for publishable libraries and to `full` for
                                 buildable libraries. The `full` value can
                                 not be used for publishable libraries.
    --displayBlock, -b           Specifies if the component generated style                                   [boolean]
                                 will contain `:host { display: block; }`.
                                 Disclaimer: This option is only valid when
                                 `--standalone` is set to `true`. _Note:
                                 This is only supported in Angular versions
                                 >= 14.1.0_
    --flat                       Ensure the generated standalone component                                    [boolean]
                                 is not placed in a subdirectory.
                                 Disclaimer: This option is only valid when
                                 `--standalone` is set to `true`. _Note:
                                 This is only supported in Angular versions
                                 >= 14.1.0_
    --importPath                 The library name used to import it, like                                      [string]
                                 `@myorg/my-awesome-lib`. Must be a valid
                                 npm name.
    --inlineStyle, -s            Include styles inline in the component.ts                                    [boolean]
                                 file. Only CSS styles can be included
                                 inline. By default, an external styles file
                                 is created and referenced in the
                                 component.ts file. Disclaimer: This option
                                 is only valid when `--standalone` is set to
                                 `true`. _Note: This is only supported in
                                 Angular versions >= 14.1.0_
    --inlineTemplate, -t         Include template inline in the component.ts                                  [boolean]
                                 file. By default, an external template file
                                 is created and referenced in the
                                 component.ts file. Disclaimer: This option
                                 is only valid when `--standalone` is set to
                                 `true`. _Note: This is only supported in
                                 Angular versions >= 14.1.0_
    --linter                     The tool to use for running lint checks.          [string] [choices: "eslint", "none"]
                                                                                                    [default: "eslint"]
    --prefix, -p                 The prefix to apply to generated selectors.                                   [string]
    --selector                   The HTML selector to use for this                                             [string]
                                 component. Disclaimer: This option is only
                                 valid when `--standalone` is set to `true`.
                                 _Note: This is only supported in Angular
                                 versions >= 14.1.0_
    --setParserOptionsProject    Whether or not to configure the ESLint                                       [boolean]
                                 `parserOptions.project` option. We do not
                                 do this by default for lint performance
                                 reasons.
    --simpleName                 Don't include the directory in the name of                                   [boolean]
                                 the module or standalone component entry of
                                 the library.
    --skipModule                 Whether to skip the creation of a default                                    [boolean]
                                 module when generating the library.
    --skipSelector               Specifies if the component should have a                                     [boolean]
                                 selector or not. Disclaimer: This option is
                                 only valid when `--standalone` is set to
                                 `true`. _Note: This is only supported in
                                 Angular versions >= 14.1.0_
    --skipTests                  Do not create `spec.ts` test files for the                                   [boolean]
                                 new component. Disclaimer: This option is
                                 only valid when `--standalone` is set to
                                 `true`. _Note: This is only supported in
                                 Angular versions >= 14.1.0_
    --skipTsConfig               Do not update `tsconfig.json` for                                            [boolean]
                                 development experience.
    --standalone                 Generate a library that uses a standalone                                    [boolean]
                                 component instead of a module as the entry
                                 point. _Note: This is only supported in
                                 Angular versions >= 14.1.0_
    --strict                     Create a library with stricter type                          [boolean] [default: true]
                                 checking and build optimization options.
    --style                      The file extension or preprocessor to use    [string] [choices: "css", "scss", "sass",
                                 for style files, or `none` to skip                    "less", "none"] [default: "css"]
                                 generating the style file. Disclaimer: This
                                 option is only valid when `--standalone` is
                                 set to `true`. _Note: This is only
                                 supported in Angular versions >= 14.1.0_
    --tags                       Add tags to the library (used for linting).                                   [string]
    --unitTestRunner             Test runner to use for unit tests.         [string] [choices: "karma", "jest", "none"]
                                                                                                      [default: "jest"]
    --viewEncapsulation, -v      The view encapsulation strategy to use in       [string] [choices: "Emulated", "None",
                                 the new component. Disclaimer: This option                                "ShadowDom"]
                                 is only valid when `--standalone` is set to
                                 `true`. _Note: This is only supported in
                                 Angular versions >= 14.1.0_
    --skipFormat                 Skip formatting files.                                                       [boolean]
    --skipPackageJson            Do not add dependencies to `package.json`.                                   [boolean]
    --simpleModuleName           Keep the module name simple (when using                                      [boolean]
                                 `--directory`).
    --standaloneConfig           Split the project configuration into                         [boolean] [default: true]
                                 `<projectRoot>/project.json` rather than
                                 including it inside `workspace.json`.



Find more information and examples at: https://nx.dev/packages/angular/generators/library

Generate a feature library

Run the below command to generate a feature library

nx g lib --directory=features --name={{feature name}} --routing --simpleName --standalone --style=scss --flat

Consider naming the feature the same as the route it represents, if applicable

Do use the --standalone flag whenever possible