Webpack e carregamento de imagem HTML angular

Question

Feb 15, 2016, 03:44 AM

Webpack e carregamento de imagem HTML angular

Eu tenho quebrado minha cabeça com webpack e angular. Isso pode ter uma resposta simples, mas não consigo descobrir. Eu li quase todas as respostas aqui no estouro de pilha sobre este tópico sem sucesso.

Eu tenho uma página html como esta (também outro modelo que tem imagens):

<body>
    <img ng-src="../images/angular-webpack.png">

    <md-button class="md-primary md-raised">
        Button
    </md-button> 
</body>

Eu também tenho uma configuração do webpack:

var webpack = require('webpack');
var CopyWebpackPlugin = require('copy-webpack-plugin');
var path = require('path');

module.exports = {
    context: path.resolve(__dirname + '/src'),
    entry: ['./js/core/app.module.js'],
    output: {
        path: './release',
        publicPath:'/',
        filename: 'app.js'
    },
    module: {
        loaders: [
            {
                test: /\.html/,
                exclude: 'node_modules',
                loader: 'raw-loader'
            },
            {
                test: /\.css/,
                exclude: 'node_modules',
                loader: 'style-loader!css-loader'
            },
            {
                test: /\.(jpe?g|png)$/i,
                exclude: 'node_modules',
                loader: 'url-loader?limit=8192!img'
            }
        ]
    },
    plugins: [
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                warnings: false
            }
        }),
        new CopyWebpackPlugin([
            {from: './index.html', to: './index.html'}
        ], {
            ignore: [
                '*.txt',
                {glob: '**/*', dot: true}
            ]
        })
    ],
    devServer: {
        contentBase: './release'
    },
    watch: true
};

... mas não vejo minhas imagens carregando. Eu tentei o URL-loader, carregador de arquivos com publicPath e sem ele. Estou confuso, não sei como formatar a configuração do webpack ou a tag de imagem html para que funcione.

Alguém tem alguma experiência em fazer com que as imagens funcionem com o webpack? Também não quero incluir minhas imagens nos controladores ou em qualquer outro arquivo js. Quero que as imagens sejam declaradas na página html.