我有一个使用TypeScript编写的Angular 1.5应用程序组件。我使用webpack作为构建工具。我有以下组件 -
import {Component} from "../../common/decorators"
const app = angular.module('app');
@Component(app, {
selector: 'navComponent',
controllerAs: 'ctrl',
styleUrls: './nav.style.scss',
templateUrl: './nav.template.html'
})
class navComponent {
static $inject = ['$scope', '$attrs', '$element'];
constructor(private $element, $scope: ng.IScope, $attrs) {
}
}
装饰器是
export const Component = function(module: ng.IModule, options: {
selector:string,
controllerAs?: string,
styleUrls?: string,
template?: string,
templateUrl?: string
}) {
return (controller: Function) => {
module.component(options.selector, angular.extend(options, { controller: controller }));
}
}
本地机器上运行正常,但在进行webpack打包后,使用bundle.js在生产环境中无法正常工作。
这是我正在使用的加载器。
loaders: [
{
test: /\.html$/,
loader: 'html-loader',
}
以下是错误信息:
错误: [$compile:tpload] 无法加载模板:/components/nav/nav.template.html (HTTP状态码:404 Not Found)
require
,Webpack为我的应用程序生成一个大的JS文件。它可以在没有对任何模板HTML的请求的情况下工作,只需从API获取JSON即可。 - Makarov Sergey