Generate minimal component in app, with defaultProject lib

[krbaio3]

🐞 Bug report

Command (mark with an x)

• new
• build
• serve
• test
• e2e
• generate
• add
• update
• lint
• extract-i18n
• run
• config
• help
• version
• doc

Is this a regression?

Yes, the previous version in which this bug was not present was: ....

Description

When I generate a component, with --minimal ( inlineTemplate, inlineStyle, skipTests => true, style: scss), it is generated with test, template and css.

🔬 Minimal Reproduction

I created a NG app with ng new bug-ng-cli --create-application false --strict false.
I run ng add @angular-eslint/schematics
I run ng g application demo --minimal --minimal --routing --style scss
I run ng g @angular-eslint/schematics:convert-tslint-to-eslint --remove-tslint-if-no-more-tslint-targets --ignore-existing-tslint-config demo
I run ng g library foo

If i run:

▶ ng g c components/authComponent --project=demo -d
CREATE projects/demo/src/app/components/auth-component/auth-component.component.ts (288 bytes)
UPDATE projects/demo/src/app/app.module.ts (516 bytes)

It is Ok.

But, If I change my defaultProject from demo to foo (library)

▶ ng g c components/authComponent --project=demo -d
CREATE projects/demo/src/app/components/auth-component/auth-component.component.css (0 bytes)
CREATE projects/demo/src/app/components/auth-component/auth-component.component.html (29 bytes)
CREATE projects/demo/src/app/components/auth-component/auth-component.component.spec.ts (676 bytes)
CREATE projects/demo/src/app/components/auth-component/auth-component.component.ts (306 bytes)
UPDATE projects/demo/src/app/app.module.ts (516 bytes)

The repository example is: https://github.com/krbaio3/bug-ng-cli.git

Thanks!

[alan-agius4]

Hi @krbaio3, \this is because minimal only effects application projects. It is important to mention that minimal projects only meant to be used for testing / prototyping and are to be considered as throw away projects.

What is the user-case here to have minimal respected in a library project?

[krbaio3]

Hi @alan-agius4,,

My intention is to make a library and then, a minimal project with a small example (demo) of how to use it. This way, I avoid having in the demo everything related to testing, linter, etc., since it is just that, a small example.

I understand that I may be wrong, but I like to have inside the projects folder the library, and separately, in another folder, the demo of using the library.

Thank you very much!

[alan-agius4]

Hi @krbaio3,

Thanks for getting back, however the above doesn't answer my question to why you need a library project to support the minimal option, ie doesn't generate inlined templates and inlined styles.

That said, you can use disable these either by passing the following CLI arguments --no-inline-style --skip-tests --no-inline-template to ng generate component or by setting these in angular.json, so that everything you create a component you don't need to provide the previously mentioned flags.

This can be done by using ng config as shown below;

 ng config projects.auth.schematics.@schematics/angular:component '{inlineTemplate: true, inlineStyle: true, skipTests: true}'

More information about these options can be found https://angular.io/cli/generate#component-command

[krbaio3]

Hi!,

My demo project has this config:

▶ ng config projects.demo.schematics
{
  "@schematics/angular:component": {
    "inlineTemplate": true,
    "inlineStyle": true,
    "style": "scss",
    "skipTests": true
  },
  "@schematics/angular:class": {
    "skipTests": true
  },
  "@schematics/angular:directive": {
    "skipTests": true
  },
  "@schematics/angular:guard": {
    "skipTests": true
  },
  "@schematics/angular:interceptor": {
    "skipTests": true
  },
  "@schematics/angular:module": {
    "skipTests": true
  },
  "@schematics/angular:pipe": {
    "skipTests": true
  },
  "@schematics/angular:service": {
    "skipTests": true
  }
}

and my library has this config:

▶ ng config projects.auth
{
  "projectType": "library",
  "schematics": {
    "@schematics/angular:component": {
      "inlineTemplate": true,
      "inlineStyle": true,
      "style": "scss",
      "skipTests": true
    }
  },
  "root": "projects/auth",
  "sourceRoot": "projects/auth/src",
  "prefix": "lib",
  "architect": {
    "build": {
      "builder": "@angular-devkit/build-angular:ng-packagr",
      "options": {
        "tsConfig": "projects/auth/tsconfig.lib.json",
        "project": "projects/auth/ng-package.json"
      },
      "configurations": {
        "production": {
          "tsConfig": "projects/auth/tsconfig.lib.prod.json"
        }
      }
    },
    "test": {
      "builder": "@angular-devkit/build-angular:karma",
      "options": {
        "main": "projects/auth/src/test.ts",
        "tsConfig": "projects/auth/tsconfig.spec.json",
        "karmaConfig": "projects/auth/karma.conf.js"
      }
    },
    "lint": {
      "builder": "@angular-eslint/builder:lint",
      "options": {
        "lintFilePatterns": [
          "projects/auth/**/*.ts",
          "projects/auth/**/*.html"
        ]
      }
    }
  }
}

My minimal project is "demo". That is, I build my library with my logic, and I want to use it in my demo project. The demo project is an example of using the library.

The --minimal flag is in the demo project, not the library.

My main project is the library, so I change the defaultProject from demo to auth.

When I generate the components like this: ng g c components/authComponent --project=demo, it generates the components with the "normal configuration", but I want the minimal configuration, because I have indicated. It is ignoring the angular.json configuration by the demo project (above).

[alan-agius4]

@krbaio3, thanks for the above explanation. Managed to find the issue.