Here is the simplified structure of my Angular 2 app folder:
https://i.sstatic.net/jrzE9.jpg
Also, here is how my webpack.config.js file looks like:
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: {
'polyfills': './polyfills.ts',
'vendor': './vendor.ts',
'app': './app/main.ts'},
output: {
path: './dist',
filename: '[name].js',
chunkFilename: "[id].bundle.js",
sourcemapFilename: '[name].map'
},
module: {
loaders: [
{test: /\.ts$/, loaders: ['ts', 'angular2-template-loader']},
{
test: /\.html$/,
loader: 'html'
},
{
test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
loader: 'file?name=assets/[name].[hash].[ext]'
},
,{ test: /\.css$/, loaders: 'style!css' }
]
},
resolve: {
extensions: ['', '.js', '.ts']
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: ['app', 'vendor', 'polyfills']
}),
new HtmlWebpackPlugin({
template: './index.html'
})
]
}
After executing webpack build, I noticed that only index.html, app.js, polyfills.js, and vendor.js are copied to the dist folder. The components such as app.component.html, css files, and users component html files in their respective folders under app/users are not being transferred to the dist directory.
https://i.sstatic.net/On6BT.jpg
Can you tell me what I might be missing?
EDIT:
This is a screenshot from Dev Tools: