Graham/angular-cli
1
0
Fork 0
mirror of https://github.com/angular/angular-cli.git synced 2025-05-16 18:43:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(@schematics/angular): add 'none' value for the 'style' option of the component schematic

Browse Source 
Allow setting `--style=none` for the component schematic to prevent generation of any style file.  Previously this was possible only with `--inlineStyle=true`, which had the side-effect of adding an inline style block to the component decorator.  Useful for components or projects which have entirely externalised stylesheets and never want to use component-specific styles.
This commit is contained in:
David Scourfield 2021-06-16 12:40:26 +01:00 committed by Filipe Silva
parent cef94e10b5
commit 8ad1539c5e
4 changed files with 17 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/schematics/angular/component/files/__name@dasherize@if-flat__/__name@dasherize__.__type@dasherize__.ts.template
View File

@ -14,7 +14,7 @@ import { Component, OnInit<% if(!!viewEncapsulation) { %>, ViewEncapsulation<% }
display: block;
}
`<% } %>
]<% } else { %>
]<% } else if (style !== 'none') { %>
styleUrls: ['./<%= dasherize(name) %><%= type ? '.' + dasherize(type): '' %>.<%= style %>']<% } %><% if(!!viewEncapsulation) { %>,
encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>,
changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %>

5
packages/schematics/angular/component/index.ts
View File

@ -30,7 +30,7 @@ import { applyLintFix } from '../utility/lint-fix';
import { parseName } from '../utility/parse-name';
import { validateHtmlSelector, validateName } from '../utility/validation';
import { buildDefaultPath, getWorkspace } from '../utility/workspace';
import { Schema as ComponentOptions } from './schema';
import { Schema as ComponentOptions, Style } from './schema';
function readIntoSourceFile(host: Tree, modulePath: string): ts.SourceFile {
const text = host.read(modulePath);
@ -135,9 +135,10 @@ export default function (options: ComponentOptions): Rule {
validateName(options.name);
validateHtmlSelector(options.selector);
const skipStyleFile = options.inlineStyle || options.style === Style.None;
const templateSource = apply(url('./files'), [
options.skipTests ? filter((path) => !path.endsWith('.spec.ts.template')) : noop(),
options.inlineStyle ? filter((path) => !path.endsWith('.__style__.template')) : noop(),
skipStyleFile ? filter((path) => !path.endsWith('.__style__.template')) : noop(),
options.inlineTemplate ? filter((path) => !path.endsWith('.html.template')) : noop(),
applyTemplates({
...strings,

13
packages/schematics/angular/component/index_spec.ts
View File

@ -7,7 +7,7 @@
*/
import { SchematicTestRunner, UnitTestTree } from '@angular-devkit/schematics/testing';
import { Schema as ApplicationOptions } from '../application/schema';
import { Style as AppStyle, Schema as ApplicationOptions } from '../application/schema';
import { createAppModule } from '../utility/test';
import { Schema as WorkspaceOptions } from '../workspace/schema';
import { ChangeDetection, Schema as ComponentOptions, Style } from './schema';
@ -43,7 +43,7 @@ describe('Component Schematic', () => {
inlineStyle: false,
inlineTemplate: false,
routing: false,
style: Style.Css,
style: AppStyle.Css,
skipTests: false,
skipPackageJson: false,
};
@ -278,6 +278,15 @@ describe('Component Schematic', () => {
expect(tree.files).not.toContain('/projects/bar/src/app/foo/foo.component.css');
});
it('should respect the style=none option', async () => {
const options = { ...defaultOptions, style: Style.None };
const tree = await schematicRunner.runSchematicAsync('component', options, appTree).toPromise();
const content = tree.readContent('/projects/bar/src/app/foo/foo.component.ts');
expect(content).not.toMatch(/styleUrls: /);
expect(tree.files).not.toContain('/projects/bar/src/app/foo/foo.component.css');
expect(tree.files).not.toContain('/projects/bar/src/app/foo/foo.component.none');
});
it('should respect the type option', async () => {
const options = { ...defaultOptions, type: 'Route' };
const tree = await schematicRunner.runSchematicAsync('component', options, appTree).toPromise();

4
packages/schematics/angular/component/schema.json
View File

@ -77,10 +77,10 @@
]
},
"style": {
"description": "The file extension or preprocessor to use for style files.",
"description": "The file extension or preprocessor to use for style files, or 'none' to skip generating the style file.",
"type": "string",
"default": "css",
"enum": ["css", "scss", "sass", "less"],
"enum": ["css", "scss", "sass", "less", "none"],
"x-user-analytics": 5
},
"type": {