vue背景图片资源加载问题

主要问题：
通过img的src加载图片可以加载出来，但是通过css用图片做背景时发现加载不出来
问题代码：

<template>
  <div id="app">
    <!--无法加载-->
    <!--<div style="background:url('./assets/flower.jpg'); height:200px; width:200px">-->
     <!--解决方法-->
    <div :style="{background:url_back_img}">
      xxxx
    </div>
    <img src="./assets/logo.png"/>
    <img :src="back_img">
    <router-view/>
  </div>
</template>

<script>
export default {
  name: 'App',
  data() {
    return {
      back_img: require('./assets/logo.png'),
      url_back_img: "url("+require('./assets/flower.jpg')+")"
    }
  }
}
</script>

主要原因是编译后目录结构改变导致，我用了个粗暴的方法，直接require(“图片路径”)，通过这种方式来直接加载图片。

网上搜了下通过分析vue编译过程来分析解决方法的，可以通过修改配置来实现。
下面这个博客详细分析各种情况下会出现的问题和产生的原因，并通过修改配置来解决相应问题。
具体参考：https://segmentfault.com/a/1190000012135787