通過Typescript中的Webpack導入Jade模板

Question

我試圖掌握當前的前端技術，並希望使用Webpack加載Jade模板。 使用Javascript，可以正常工作。

app.js ：

import * as foo from "html!jade-html!./header.jade";
document.write(foo.default);

但是，如果我將其重命名為app.ts ，內容不變，則使用webpack構建：

ERROR in ./app.ts
(5,22): error TS2307: Cannot find module 'html!jade-html!./header.jade'.

我很驚訝使用TypeScript加載模塊的語義會突然改變。 是什么賦予了？

優點：可以將此Jade加載代碼段寫得短些嗎？

Answer 1

TypeScript為import關鍵字分配特殊含義（需要一個實際的模塊）。 您應該改為定義一個require函數，並使用var foo = require('...') （注意var而不是import ）。

這是ts-loader docs中需求定義的示例。

declare var require: {
    <T>(path: string): T;
    (paths: string[], callback: (...modules: any[]) => void): void;
    ensure: (paths: string[], callback: (require: <T>(path: string) => T) => void) => void;
};