Как загрузить локальный HTML-файл с помощью веб-просмотра

Я создаю электронное приложение, в котором я загружаю html-файл, используя этот код в разработке:

<webview id="foo" src="/src/documents/example.html" style="display:inline-flex; width:100%; height:550px"></webview>

Это хорошо работает в разработке, но как только приложение упаковано, оно показывает пустую страницу. Я исследовал, и кажется, что использование __dirname может решить проблему.

Я все еще очень новичок в электроне и не могу понять, как добраться до этого пути (src="/src/documents/), используя __dirname.

Любая помощь будет высоко оценена.


person Germain Rwibutso    schedule 05.11.2018    source источник


Ответы (1)


Я подумал, что поделюсь решением, которое я нашел по этому поводу. По сути, вам нужно создать маршрут для страницы, которую вы хотите загрузить, следующим образом:

{
  path:'/example',
  name:'example',
  component: require('@/components/example').default
},

Если вы используете electronic-vue, убедитесь, что расширение страницы — «.vue», и приложите содержимое страницы следующим образом:

<template>
<html>
**Put the page content in here**
</html> 
</template>

В моем случае я хотел перейти на страницу, нажав на кнопку, поэтому я использовал Vue-router следующим образом:

<button type="button" class="btn btn-light"><a id="home"><router-link :to="{ name: 'example' }"> Button text </router-link></a>
</button>

И вуаля!

person Germain Rwibutso    schedule 20.11.2018