Angular 2 Web Pack 404 Html 模板网址

Question

我正在使用 Angular2 RC4 版本和 webpack 开发服务器。我无法成功加载我的应用程序。在浏览器控制台上它抛出 404 并且无法使用 webpack 加载 AppComponent 模板文件。如果我使用 lite-server

这有效

app.component.ts 片段

@Component({
    moduleId:module.id,
    selector: 'body',
    templateUrl: 'app.component.html',
})

webpack.config.js 片段

 module:{
       loaders:[
            {test:/\.ts$/, loader:'ts',   exclude: /node_modules/},
            {test:/\.html$/, loader:'html' },
       ],

    },

错误 browser_adapter.js?0526:84错误：未捕获（承诺）：无法加载/app.component.html

Answer 1

如果是 Angular2 webpack，

像这样使用模板-

  template: require('./app.component.html'),
  styles: [require('./app.component.css')]

而不是

  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']

看看这是否有帮助。

Answer 2

另一种选择是将 awesome-typescript-loader 与 angular2-template-loader 结合使用，为您内联所有样式，而您不需要 require。

https://github.com/TheLarkInn/angular2-template-loader

  module: {
    loaders: [
      {
        test: /\.ts$/,
        loaders: ['awesome-typescript-loader', 'angular2-template-loader'],
        exclude: [/\.(spec|e2e)\.ts$/]
      }
    ]
  },

Angular 2 Web Pack 404 Html 模板网址

Angular 2 Web Pack 404 Html Template Urls

webpack-dev-server

angular