在与webpack的vue样式的残破的图象

Question

这是风格

<style scoped>
    section.hero {
        background-image: url('../../img/mountain.jpg');
        height: 400px;
    }
</style>

我希望它可以加载山峰图像，但它却什么都没有。 样式位于myproject/src/components/Header.vue，图片位于myproject/img/mountain.jpg

这是我的webpack loader config

    test: /\.vue$/,
    loader: 'vue-loader',
    options: {
      loaders: {
        // Since sass-loader (weirdly) has SCSS as its default parse mode, we map
        // the "scss" and "sass" values for the lang attribute to the right configs here.
        // other preprocessors should work out of the box, no loader config like this necessary.
        'scss': 'vue-style-loader!css-loader!sass-loader',
        'sass': 'vue-style-loader!css-loader!sass-loader?indentedSyntax'
      }
      // other vue-loader options go here
    }
  },
  {
    test: /\.js$/,
    loader: 'babel-loader',
    exclude: /node_modules/
  },
  {
    test: /\.(png|jpg|gif|svg)$/,
    loader: 'file-loader',
    options: {
      name: '[name].[ext]?[hash]'
    }
  },
  {
    test: /\.css$/,
    use: [ 'style-loader', 'css-loader' ]
  },
  {
    test: /\.(png|jpg|gif)$/,
    use: [
      {
        loader: 'url-loader',
        options: {
          limit: 8192
        }
      }
    ]
  }

控制台看起来很好..没有记录错误。 但是，图像未加载。这是破碎的形象。
请帮忙