undefinedfix
Sign in

Ask big brother Vue packaging when video post image path error

user129412 edited in Thu, 18 Aug 2022

1. After packaging, the image path of the post under the video has been reporting errors. When it is not packaged, it is normal to access through port 8080.

2. This is the code

<div class="videoWrap" v-if="news.ShowType==3" @click="jumpNewsDetails(news.ShowType,news.SKID)">
                              <video class="video"
                                         :class="`${page.SKID}video${clickLikenewsIndex}`"
                                         width="320"
                                         height="240"
                                         controls
                                         webkit-playsinline="true"
                                         playsinline="true"
                                         :poster="news.News_Video_Pic ? news.News_Video_Pic :'../../static/img/television.png'">
                                  <source :src="news.News_Video" type="video/mp4">
                                  您的浏览器不支持 video 标签。
                              </video>
                           </div>

·The following is accessed through port 8080

·Here is the result of the package

1 Replies
gjotc
commented on Thu, 18 Aug 2022

In development mode, the path of the current. Vue file is used as the relative path, so you write '/. / static / img/ television.png 'you can find it, but after packaging, we use our HTML file as the relative path. At this time, our page (HTML file) and static folder are in the same path, so here you can write it as'. / static / img/ television.png 'search failed.

Generally, the image path will be generated by the method of import, and then assigned in the form of variables, so as to ensure that there will be no error in path parsing after packaging.

lock This question has been locked and the reply function has been disabled.