我使用 webpack 来构建一个 Angular 项目。我的 webpack 配置是从另一个项目中复制而来的，它可以成功运行。
但在我的项目中，它不会将 .html 模板包含到生成的 javascript 包中。
这是感兴趣的 webpack 配置部分：
const webpackConfig = {
...
module: {
...
plugins: [
new HtmlWebpackPlugin({
inject: "body",
template: "app/index.html",
filename: "index.html"
})
],
loaders: [
...
{
test: /\.html$/,
exclude: `${path.join(__dirname, "/app/index.html")}`,
loaders: [`ngtemplate?relativeTo=${path.join(__dirname, "/app")}`, "html"]
}
]
}
}
我的项目的脚手架如下：
├── app
│ ├── app.js
│ ├── components
│ │ ├── auth
│ │ │ ├── auth.module.js
│ │ │ ├── auth.service.js
│ │ │ └── user.service.js
│ │ ├── footer
│ │ │ └── footer.html
│ │ ├── header
│ │ │ └── header.html
│ │ ├── home
│ │ │ ├── home.html
│ │ │ └── home.module.js
│ │ ├── navigation
│ │ │ └── navigation.html
│ │ ├── right_sidebar
│ │ │ └── right_sidebar.html
│ │ └── util
│ │ ├── util.module.js
│ │ └── util.service.js
│ ├── index.html
│ └── shared
├── assets
├── package.json
├── gulpfile.js
└── webpack.config.js
在index.html我说：
<div id="header" ng-include="'/components/header/header.html'"></div>
并且标题模板不包含在生成的app.<hash>.js捆绑包中。如何调试这个？