如何让ngtemplate-loader使用Webpack 3,Angular 1,TypeScript和ES 6模块?
问题描述:
我想配置ngtemplate装载机能够用我的角模板的打字稿文件像这样:在webpack.config如何让ngtemplate-loader使用Webpack 3,Angular 1,TypeScript和ES 6模块?
import myTemplateUrl from './hello-angular2-template.thtml';
angular
.module('pd')
.component('helloAngular2', {
templateUrl: myTemplateUrl,
});
装载机的定义:
module: {
rules: [
// Angular Template HTML
{
test: /\.thtml$/,
use: [
{
loader: 'ngtemplate-loader',
},
{
loader: 'html-loader',
}
],
},
(奇怪*。 Ththml后缀就是这样,没有标准的html加载器可以干涉)。
然而,模板永远不会被加载(导入后未定义)。
我试图
options: {
exportAsEs6Default: true
}
添加到链接的HTML加载器,但没有工作了。
答
看起来它是在ngtemplate装载机的错误/丢失功能。
我创建了一个问题:
https://github.com/WearyMonkey/ngtemplate-loader/issues/63
,并修复它
https://github.com/WearyMonkey/ngtemplate-loader/pull/64
希望它就会很快接受pull请求。现在我可以将我的package.json指向包含我的fork中修复的提交。
答
我做了这个设置的工作:
{
test: /\.html$/,
use: [
{
loader: 'ngtemplate-loader',
options: {
angular: true,
},
},
{
loader: 'raw-loader',
},
],
};
的包版本:
"webpack": "^3.5.0",
"angular": "^1.6.5",
"ngtemplate-loader": "^2.0.1",
"raw-loader": "^0.5.1",
答
的一种方式,使其工作是使用import * as templateUrl from './../..';
:
import * as myTemplateUrl from './hello-angular2-template.thtml';
angular
.module('pd')
.component('helloAngular2', {
templateUrl: myTemplateUrl,
});
import.d.ts
定义:
declare module '*.thtml' {
var _: string;
export = _;
}
没有为我工作。 – altso