Skip to content

Commit a057ba0

Browse files
gerasimovpkgerasimovpk
committed
add my sample component
1 parent d2bef98 commit a057ba0

5 files changed

Lines changed: 248 additions & 0 deletions

File tree

‎packages/@angular/cli/blueprints/my-sample-component/files/__path__/__name__.component.spec.ts‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { <%= classifiedModuleName %>Component } from './<%= dasherizedModuleName %>.component';
4+
5+
describe('<%= classifiedModuleName %>Component', () => {
6+
let component: <%= classifiedModuleName %>Component;
7+
let fixture: ComponentFixture<<%= classifiedModuleName %>Component>;
8+
9+
beforeEach(async(() => {
10+
TestBed.configureTestingModule({
11+
declarations: [ <%= classifiedModuleName %>Component ]
12+
})
13+
.compileComponents();
14+
}));
15+
16+
beforeEach(() => {
17+
fixture = TestBed.createComponent(<%= classifiedModuleName %>Component);
18+
component = fixture.componentInstance;
19+
fixture.detectChanges();
20+
});
21+
22+
it('should create', () => {
23+
expect(component).toBeTruthy();
24+
});
25+
});

‎packages/@angular/cli/blueprints/my-sample-component/files/__path__/__name__.component.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import { Component, OnInit<% if(viewEncapsulation) { %>, ViewEncapsulation<% }%><% if(changeDetection) { %>, ChangeDetectionStrategy<% }%> } from '@angular/core';
2+
3+
@Component({
4+
selector: '<%= selector %>',<% if(inlineTemplate) { %>
5+
template: `
6+
<p>
7+
<%= dasherizedModuleName %> Works!
8+
</p>
9+
`,<% } else { %>
10+
templateUrl: './tpl/<%= dasherizedModuleName %>.component.html',<% } if(inlineStyle) { %>
11+
styles: []<% } else { %>
12+
styleUrls: ['./styles/<%= dasherizedModuleName %>.component.<%= styleExt %>']<% } %><% if(viewEncapsulation) { %>,
13+
encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection) { %>,
14+
changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %>
15+
})
16+
export class <%= classifiedModuleName %>Component implements OnInit {
17+
18+
constructor() { }
19+
20+
ngOnInit() {
21+
}
22+
23+
}

‎packages/@angular/cli/blueprints/my-sample-component/files/__path__/styles/__name__.component.__styleext__‎

Whitespace-only changes.

‎packages/@angular/cli/blueprints/my-sample-component/files/__path__/tpl/__name__.component.html‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
<p>
2+
<%= dasherizedModuleName %> works!
3+
</p>

‎packages/@angular/cli/blueprints/my-sample-component/index.ts‎

Lines changed: 197 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,197 @@
1+
import { NodeHost } from '../../lib/ast-tools';
2+
3+
import * as fs from 'fs';
4+
import * as path from 'path';
5+
import * as chalk from 'chalk';
6+
const Blueprint = require('../../ember-cli/lib/models/blueprint');
7+
const dynamicPathParser = require('../../utilities/dynamic-path-parser');
8+
const findParentModule = require('../../utilities/find-parent-module').default;
9+
const getFiles = Blueprint.prototype.files;
10+
const stringUtils = require('ember-cli-string-utils');
11+
const astUtils = require('../../utilities/ast-utils');
12+
13+
export default Blueprint.extend({
14+
description: '',
15+
16+
availableOptions: [
17+
{ name: 'flat', type: Boolean },
18+
{ name: 'inline-template', type: Boolean, aliases: ['it'] },
19+
{ name: 'inline-style', type: Boolean, aliases: ['is'] },
20+
{ name: 'prefix', type: String, default: null },
21+
{ name: 'spec', type: Boolean },
22+
{ name: 'view-encapsulation', type: String, aliases: ['ve'] },
23+
{ name: 'change-detection', type: String, aliases: ['cd'] },
24+
{ name: 'skip-import', type: Boolean, default: false },
25+
{ name: 'module', type: String, aliases: ['m'] },
26+
{ name: 'export', type: Boolean, default: false }
27+
],
28+
29+
beforeInstall: function (options: any) {
30+
if (options.module) {
31+
// Resolve path to module
32+
const modulePath = options.module.endsWith('.ts') ? options.module : `${options.module}.ts`;
33+
const parsedPath = dynamicPathParser(this.project, modulePath);
34+
this.pathToModule = path.join(this.project.root, parsedPath.dir, parsedPath.base);
35+
36+
if (!fs.existsSync(this.pathToModule)) {
37+
throw 'Module specified does not exist';
38+
}
39+
} else {
40+
try {
41+
this.pathToModule = findParentModule(this.project, this.dynamicPath.dir);
42+
} catch (e) {
43+
if (!options.skipImport) {
44+
throw `Error locating module for declaration\n\t${e}`;
45+
}
46+
}
47+
}
48+
},
49+
50+
normalizeEntityName: function (entityName: string) {
51+
const parsedPath = dynamicPathParser(this.project, entityName);
52+
53+
this.dynamicPath = parsedPath;
54+
55+
let defaultPrefix = '';
56+
if (this.project.ngConfig &&
57+
this.project.ngConfig.apps[0] &&
58+
this.project.ngConfig.apps[0].prefix) {
59+
defaultPrefix = this.project.ngConfig.apps[0].prefix;
60+
}
61+
62+
let prefix = (this.options.prefix === 'false' || this.options.prefix === '')
63+
? '' : (this.options.prefix || defaultPrefix);
64+
prefix = prefix && `${prefix}-`;
65+
66+
this.selector = stringUtils.dasherize(prefix + parsedPath.name);
67+
68+
if (this.selector.indexOf('-') === -1) {
69+
this._writeStatusToUI(chalk.yellow, 'WARNING', 'selectors should contain a dash');
70+
}
71+
72+
return parsedPath.name;
73+
},
74+
75+
locals: function (options: any) {
76+
this.styleExt = 'css';
77+
if (this.project.ngConfig &&
78+
this.project.ngConfig.defaults &&
79+
this.project.ngConfig.defaults.styleExt) {
80+
this.styleExt = this.project.ngConfig.defaults.styleExt;
81+
}
82+
83+
options.inlineStyle = options.inlineStyle !== undefined ?
84+
options.inlineStyle :
85+
this.project.ngConfigObj.get('defaults.component.inlineStyle');
86+
87+
options.inlineTemplate = options.inlineTemplate !== undefined ?
88+
options.inlineTemplate :
89+
this.project.ngConfigObj.get('defaults.component.inlineTemplate');
90+
91+
options.flat = options.flat !== undefined ?
92+
options.flat :
93+
this.project.ngConfigObj.get('defaults.component.flat');
94+
95+
options.spec = options.spec !== undefined ?
96+
options.spec :
97+
this.project.ngConfigObj.get('defaults.component.spec');
98+
99+
options.viewEncapsulation = options.viewEncapsulation !== undefined ?
100+
options.viewEncapsulation :
101+
this.project.ngConfigObj.get('defaults.component.viewEncapsulation');
102+
103+
options.changeDetection = options.changeDetection !== undefined ?
104+
options.changeDetection :
105+
this.project.ngConfigObj.get('defaults.component.changeDetection');
106+
107+
return {
108+
dynamicPath: this.dynamicPath.dir.replace(this.dynamicPath.appRoot, ''),
109+
flat: options.flat,
110+
spec: options.spec,
111+
inlineTemplate: options.inlineTemplate,
112+
inlineStyle: options.inlineStyle,
113+
route: options.route,
114+
isAppComponent: !!options.isAppComponent,
115+
selector: this.selector,
116+
styleExt: this.styleExt,
117+
viewEncapsulation: options.viewEncapsulation,
118+
changeDetection: options.changeDetection
119+
};
120+
},
121+
122+
files: function () {
123+
let fileList = getFiles.call(this) as Array<string>;
124+
125+
if (this.options && this.options.inlineTemplate) {
126+
fileList = fileList.filter(p => p.indexOf('.html') < 0);
127+
}
128+
if (this.options && this.options.inlineStyle) {
129+
fileList = fileList.filter(p => p.indexOf('.__styleext__') < 0);
130+
}
131+
if (this.options && !this.options.spec) {
132+
fileList = fileList.filter(p => p.indexOf('__name__.component.spec.ts') < 0);
133+
}
134+
135+
return fileList;
136+
},
137+
138+
fileMapTokens: function (options: any) {
139+
// Return custom template variables here.
140+
return {
141+
__path__: () => {
142+
let dir = this.dynamicPath.dir;
143+
if (!options.locals.flat) {
144+
dir += path.sep + options.dasherizedModuleName;
145+
}
146+
const srcDir = this.project.ngConfig.apps[0].root;
147+
this.appDir = dir.substr(dir.indexOf(srcDir) + srcDir.length);
148+
this.generatePath = dir;
149+
return dir;
150+
},
151+
__styleext__: () => {
152+
return this.styleExt;
153+
}
154+
};
155+
},
156+
157+
afterInstall: function (options: any) {
158+
if (options.dryRun) {
159+
return;
160+
}
161+
162+
const returns: Array<any> = [];
163+
const className = stringUtils.classify(`${options.entity.name}Component`);
164+
const fileName = stringUtils.dasherize(`${options.entity.name}.component`);
165+
const componentDir = path.relative(path.dirname(this.pathToModule), this.generatePath);
166+
const importPath = componentDir ? `./${componentDir}/${fileName}` : `./${fileName}`;
167+
168+
if (!options.skipImport) {
169+
const preChange = fs.readFileSync(this.pathToModule, 'utf8');
170+
171+
returns.push(
172+
astUtils.addDeclarationToModule(this.pathToModule, className, importPath)
173+
.then((change: any) => change.apply(NodeHost))
174+
.then((result: any) => {
175+
if (options.export) {
176+
return astUtils.addExportToModule(this.pathToModule, className, importPath)
177+
.then((change: any) => change.apply(NodeHost));
178+
}
179+
return result;
180+
})
181+
.then(() => {
182+
const postChange = fs.readFileSync(this.pathToModule, 'utf8');
183+
let moduleStatus = 'update';
184+
185+
if (postChange === preChange) {
186+
moduleStatus = 'identical';
187+
}
188+
189+
this._writeStatusToUI(chalk.yellow,
190+
moduleStatus,
191+
path.relative(this.project.root, this.pathToModule));
192+
}));
193+
}
194+
195+
return Promise.all(returns);
196+
}
197+
});

0 commit comments

Comments
 (0)