просмотр pdf файлов в electron-app

Question

Создал проект electron с vue.js, пытаюсь отобразить в компоненте Home.vue pdf-файл, который лежит в папке public, в режиме разработчика serev и electron:serve файл отображается, но после build приложения, на странице белый экран. Google говорит проблема с путями и vue.config.js electron-build, но я никак не пойму, в чем конкретно я не прав.

структура проекта

package.json

{
  "name": "test",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "electron:build": "vue-cli-service electron:build",
    "electron:serve": "vue-cli-service electron:serve",
    "postinstall": "electron-builder install-app-deps",
    "postuninstall": "electron-builder install-app-deps"
  },
  "main": "background.js",
  "dependencies": {
    "core-js": "^3.6.5",
    "vue": "^2.6.11",
    "vue-router": "^3.2.0",
    "vuex": "^3.6.2"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "electron": "^11.0.0",
    "electron-devtools-installer": "^3.1.0",
    "node-sass": "^4.12.0",
    "sass-loader": "^8.0.2",
    "svgo": "^1.1.0",
    "svgo-loader": "^2.1.0",
    "vue-cli-plugin-electron-builder": "~2.0.0-rc.6",
    "vue-cli-plugin-svg-sprite": "~1.0.0",
    "vue-template-compiler": "^2.6.11"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ]
}

Home.vue

<template>
  <div class="container">
    <app-title :url="$route.path"
      >Title</app-title
    >
    <embed
      :src="`${publicPath}1.pdf#view=FitH&toolbar=0`"
      width="100%"
      height="810"
      alt="pdf"
    />
  </div>
</template>

<script>
export default {
  data() {
    return {
      publicPath: process.env.BASE_URL,
    };
  },
  mounted() {
  },
  components: {},
  methods: {},
};
</script>

<style lang="scss" scoped></style>

vue.config.js

module.exports = {
  css: {
    loaderOptions: {
      sass: {
        prependData: `@import "@/assets/styles/_variables.scss";`
      }
    }
  },
  chainWebpack: config => {
    config.module
      .rule('svg-sprite')
      .use('svgo-loader')
      .loader('svgo-loader')
  },
  pluginOptions: {
    electronBuilder: {
      builderOptions: {
        extraResources: ["./public/**"]
      }
    }
  },

}

БЛОГ НА HUSL

просмотр pdf файлов в electron-app

Ответы (0 шт):