webpack 图片无法输出到目录里

Question

我的webpackconfig

var path = require('path');
var webpack = require('webpack');
var $ = require("jquery")

function getPublicPath(sources) {
    if (process.env.NODE_ENV !== 'production') {
        sources='http://localhost:8080' + sources;
    }
    return sources;
}

module.exports = {
  devtool: 'source-map',
  entry: [
    'webpack-dev-server/client?http://localhost:8080',
    'webpack/hot/only-dev-server',
    './src/index'
  ],
  output: {
    path: path.join(__dirname, 'assets'),
    filename: 'bundle.js',
    publicPath: 'http://localhost:8080/static/'
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.ProvidePlugin({
        $: "jquery",
        jQuery: "jquery",
        "window.jQuery": "jquery"
    })
  ],
  module: {
    loaders: [{
      test: /\.js$/,
      loaders: ['react-hot', 'babel'],
      include: path.join(__dirname, 'src')
      },{
        test: /\.styl$/,
        loader: 'style-loader!css-loader!stylus-loader'
      },{
        test: /\.(png|jpg|gif|woff|woff2)$/,
        loader: 'url-loader?limit=8192'
      },
      {// 如果要加载jQuery插件,解析路径&参数
              test : path.resolve(__dirname,"src/common/lib/plugins/*.js$"),
              loader : "imports?jQuery=jquery,$=jquery,this=>window"
          }
    ]
  }
};

每次编译完只有 js

Hash: ba03dbf64b475f3c1c90
Version: webpack 1.13.0
Time: 9022ms
        Asset     Size  Chunks             Chunk Names
    bundle.js   952 kB       0  [emitted]  main
bundle.js.map  1.11 MB       0  [emitted]  main
   [0] multi main 52 bytes {0} [built]

我的 entry.js为

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(<App />, document.getElementById('app'));

app.js

import React, { Component } from 'react';
import LogoImg from './images/logo.png'

const Logo = () => (
  <div className="Logo">
    <a href="/llq">
      <img src={LogoImg} />
    </a>
  </div>
)


export default Logo

图片就是无法输出到assets目录下 求解。。。。

Answer 1

{
    test: /\.(png|jpg|gif|woff|woff2)$/,
    loader: 'url-loader?limit=8192'
}

你设置了url-loader，8k以下的图片都会直接转成DataUrl的形式，而不会再输出图片了...

具体可参考《webpack多页应用架构系列（六）：听说webpack连图片和字体也能打包？》