Handlebars模板和使用TypeScript的Browserify

Question

我正在將項目移植到TypeScript。該項目結合Handlebars和Browserify與hbsfy來處理模板。這意味着我有JavaScript代碼是這樣的：

var photosTemplate = require('./views/photos.hbs'); 

名爲從文件夾視圖「photos.hbs」的模板文件，它看起來有點像這裏面要求：

{{#each this}} 
    <span class="title">{{title}}</span> 
{{/each}} 

有一個gulpfile是作爲構建步驟的一部分運行，將模板轉換爲可以使用的功能。這意味着，在我的消費我的文件可以寫這樣它使用的功能模板代碼：

var newHtml = photosTemplate([{title: "test title 1"}, {title: "test title 2"}]); 

的問題是，如何可以在此進行，爲打字稿工作？我已經關掉我的var一個import並移動到使用--module commonjs編譯標誌：

import photosTemplate = require('./views/photos.hbs'); 

在這一點上，我遇到了錯誤：

error TS2307: Cannot find external module './views/photos.hbs'.

你可能會認爲這很公平。所以，我創建了一個photos.hbs.d.ts坐一起，看起來像這樣：

interface photos { 
    (context: any, options?: any): string; 
} 

export = photos; 

這是一個簡單的界面，說明是如何被使用的照片模板。然而，這種替代編譯器產生的錯誤：

error TS2304: Cannot find name 'photosTemplate'.

這裏有一個類似的問題：https://stackoverflow.com/a/23957928/761388我認爲這個問題是我的photos.hbs.d.ts文件，但我不知道有什麼不妥的地方。我覺得我在定義中缺少一些非常簡單的東西來處理外部模塊。但對我的生活，我不能制定出它是什麼......

Answer 1

這個工作對我來說...

photos.hbs.d.ts

declare function photos (context: any, options?: any): string; 

export = photos; 

使用它：

import photosTemplate = require('./views/photos.hbs'); 

photosTemplate(""); 

的原因是要真正地通話功能，不只是定義一個簽名。

你也可以這樣做：

interface Photos { 
    (context: any, options?: any): string; 
} 

declare var photos: Photos; 

export = photos;