vue component data binding is working when dev locally but not when using npm serve

[free2dog]

• I confirm that this is an issue rather than a question.

Bug report

Version

vue version 3.0.0
vuepress verison 0.14.8

Steps to reproduce

TODO

What is expected?

works perfectly fine when dev locally

yarn vuepress dev docs

What is actually happening?

when I push my code to netlify.com which build and deploy automatically
and this time the data binding not works
ALSO in .vuepress/dist/

serve

cammand to serve in localhost(127.0.0.1) does't work.

the title field changes(works fine) but the img tag's src remains to default value (not fine)(see below)

Other relevant information

• Your OS: macOS 10.14.1
• Node.js version: 11.11.0
• Browser version: chrome 72.0.3626.121
• Is this a global or local install? local
• Which package manager did you use for the install? yarn
• Does this issue occur when all plugins are disabled? not try yet

I am kind of new on Vuejs.

I have 3 component here and data bindings between them. And the data flows AllGraphs.vue > GraphHero.vue > ImageFromOss.vue

only 2 data field: the titile and the image location

AllGraphs.vue (picked default to metas[0])

<template>
  <div class="all-graphs">
    <GraphHero :title="picked.title" :imgfile="picked.img" />
  </div>
</template>
<script>
const metas = [
    {
        title: 'Personality Types',
        img: '/personality-hero.png'
    },
    {
        title: 'Sciences and Scientists',
        img: '/science-small.jpg'
    },
     {
        title: 'Actions and Behaviors',
        img: '/actions-small.png'
    },
     {
        title: 'Doctors',
        imgfile: '/doctors-small.jpg'
    }
]
export default {
  data: function(){
      return {
          picked: metas[0]
      }
  },
  mounted: function(){
      this.pick()
  },
  methods: {
    pick() {
          this.picked = metas[Math.floor(Math.random() * metas.length)]
      }
  }
};

GraphHero.vue

<template>
    <div class="graph-item">
        <div class="note-left">
            <h3>{{title}}</h3>
        </div>
        <div class="image-right">
            <ImageFromOss :imgfile="imgfile" />
        </div>
    </div>
</template>

<script>
export default {
  props: ["imgfile", "title"]
};
</script>

ImageFromOss.vue

<template>
    <img :src="ossimgpath + imgfile" width="500px"/>
</template>

<script>
export default {
  props: ["imgfile"],
  data: function(){
      return {
          ossimgpath: '//blogimg.some-oss-server.com/img'
      }
  }
};
</script>

Anyone have a clue?

todo: write a reproduction template.

[free2dog]

Problem remains in vuepress 1.0.0-alpha.44