angular2/webpackテンプレート404エラー

Question

私はこのチュートリアルに続き、チュートリアルのようなものをすべて手に入れました。 https://www.youtube.com/watch?v=4i1nLrqMR14#t=563.837081

今度は自分のアプリケーションを拡張してコンポーネントのhtmlファイルを作成し、templatURLをtemplateUrl: './app.html'に設定します。これはroot/app/app.htmlと同じディレクトリにあるためです。 root/app.htmlで探しているのでエラーが出ました。プロジェクトの構造とエラーの添付ファイルを参照してください。

のdevの変更の追跡のためのコマンド：

webpack-dev-server --inline --progress --port 4000 --content-base src 

{ 
    "compilerOptions": { 
    "module": "commonjs", 
    "target": "es5", 
    "outDir": "dist", 
    "rootDir": ".", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "moduleResolution": "node", 
    "types": [ 
     "core-js", 
     "node" 
    ] 
    }, 
    "exclude": [ 
    "node_modules" 
    ], 
    "awesomeTypescriptLoaderOptions": { 
    "useWebpackText": true 
    }, 
    "compileOnSave": false, 
    "buildOnSave": false, 
    "atom": { "rewriteTsconfig": false } 
} 

tsconfig.json webpack.config.js私が見つけた場所のトラックを失った

var webpack = require('webpack'); 
var HtmlWebPackPlugin = require('html-webpack-plugin'); 
var path = require('path'); 

module.exports = { 
    //entry:'./src/main.ts', 
    entry:{ 
     'polyfills':'./src/polyfills.browser.ts', 
     'vendor': './src/vendor.browser.ts', 
     'main': './src/main.ts', 
    }, 
    output:{ 
     path:'./dist', 
     //filename:'app.bundle.js' 
     filename: '[name].bundle.js', 
     sourceMapFilename: '[name].map', 
     chunkFilename: '[id].chunk.js' 


    }, 
    module:{ 
     loaders:[{test:/\.ts$/, loader:'ts-loader'}] 
    }, 
    resolve:{ 
     root: [ path.join(__dirname, 'src') ], //add this for dev server 
     extensions:['','.js','.ts'] 
    }, 
    plugins:[ 

     //inject all the files above into this file 
     new HtmlWebPackPlugin({ 
      template: './src/index.html' 
     }) 
    ] 


} 

Answer 1

これはWebpackが動作するようにしたい場合は、私のコンポーネントに追加する必要があります。

moduleId: module.id,