Я написал (на данный момент) простые компоненты для углового2.Импорт импортных файлов из .d.ts файла
Вот мой код до сих пор:
import {Component, View} from 'angular2/angular2';
export module SkApp.Core{
@Component({
selector: 'sk-app-side-menu'
})
@View({
template: `
<p>Hello</p>
`
})
export class SkAppSideMenu {
menuActive: boolean;
constructor(){
this.menuActive = false;
}
showMenu(){
this.menuActive = !this.menuActive;
}
}
}
Конечно, нет никакой реальной функциональности в этой точке. Но сейчас дело не в этом.
Я также создал свой собственный процесс сборки с глотком. Вот соответствующая часть этого:
gulp.task('script', ['clean'], function() {
var tsResult = tsProject.src()
.pipe(ts(tsProject));
return merge([
tsResult.dts.pipe(rename({dirname: ''}))
.pipe(concat('sk-app.d.ts'))
.pipe(gulp.dest('dist/')),
tsResult.js
.pipe(rename({dirname: ''}))
.pipe(concat('sk-app.min.js'))
.pipe(uglify())
.pipe(gulp.dest('dist/'))
]);
});
В конце я получаю два файла: Sk-app.min.js и Sk-app.d.ts
SK-app.min.js:
var __decorate=this&&this.__decorate||function(t,e,n,r){if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)return Reflect.decorate(t,e,n,r);switch(arguments.length){case 2:return t.reduceRight(function(t,e){return e&&e(t)||t},e);case 3:return t.reduceRight(function(t,r){return void(r&&r(e,n))},void 0);case 4:return t.reduceRight(function(t,r){return r&&r(e,n,t)||t},r)}},__metadata=this&&this.__metadata||function(t,e){return"object"==typeof Reflect&&"function"==typeof Reflect.metadata?Reflect.metadata(t,e):void 0},angular2_1=require("angular2/angular2"),SkApp;!function(t){var e;!function(t){var e=function(){function t(){}return t.prototype.showMenu=function(t){},t=__decorate([angular2_1.Component({selector:"sk-app"}),angular2_1.View({template:'\n <button (click)="showMenu()">click me!</button>\n\n <ng-content></ng-content>\n ',directives:[angular2_1.NgClass]}),__metadata("design:paramtypes",[])],t)}();t.SkApp=e}(e=t.Core||(t.Core={}))}(SkApp=exports.SkApp||(exports.SkApp={}));
SK-app.d.ts:
export declare module SkApp.Core {
class SkApp {
showMenu(x: string): void;
}
}
Теперь я хочу использовать этот компонент в другом angular2 проекта:
import {Component, View, bootstrap} from 'angular2/angular2';
import {SkApp} from "SkApp/Core";
@Component({
selector: 'my-app'
})
@View({
template: '<sk-app></sk-app>',
directives: [SkApp]
})
class MyAppComponent {
}
bootstrap(MyAppComponent);
Но когда я пытаюсь скомпилировать этот проект Js машинопись компилятор дает мне это сообщение:
ошибка TS2307: Не удается найти модуль «SkApp/Ядро»
Когда я изменить определения модуля в моем файле sk-app.d.ts по адресу:
declare module "SkApp/Core" {
он отлично работает. Но я хочу, чтобы файлы определения были сгенерированы с помощью gulp без необходимости самостоятельно изменять объявление модуля.
Любая помощь с этим была бы оценена.
(я, конечно, известно, что angular2 все еще находится в состоянии альфа) модуль