Vue.js - How to view or render local PDF files?

So I've tried to get a PDF viewer working with the likes of pdf.js and vue-pdf.

I can get vue-pdf to work however I can't seem to get local files to render and in the case of pdf.js I tried to download the example project on the website, https://mozilla.github.io/pdf.js/getting_started/#download, however I only get a cannot get "../.../some.pdf".

testPage.vue with vue-pdf:

<template><div><pdf src="../assets/test.pdf"></pdf></div></template><script>import pdf from 'vue-pdf'export default {name: 'test',data () {return {}},components: {pdf}}</script><style></style>

The error it gives is cannot GET "../assets/test.pdf"

testPage.vue with pdf.js:

<template><div><a href="../assets/viewer.html?=test.pdf"></a></div></template><script>export default {name: 'test',data () {return {}},components: {}}</script><style></style>

The error given is cannot GET "../assets/viewer.html?=test.pdf" clearly the errors are similar so I've probably messed up big time.

Webpack:

'use strict'const path = require('path')const utils = require('./utils')const config = require('../config')const vueLoaderConfig = require('./vue-loader.conf')function resolve (dir) {return path.join(__dirname, '..', dir)}module.exports = {entry: {app: './src/main.js'},output: {path: config.build.assetsRoot,filename: '[name].js',publicPath: process.env.NODE_ENV === 'production'? config.build.assetsPublicPath: config.dev.assetsPublicPath},resolve: {extensions: ['.js', '.vue', '.json'],alias: {'vue$': 'vue/dist/vue.esm.js','@': resolve('src'),}},module: {rules: [{test: /\.(js|vue)$/,loader: 'eslint-loader',enforce: 'pre',include: [resolve('src'), resolve('test')],options: {formatter: require('eslint-friendly-formatter')}},{test: /\.vue$/,loader: 'vue-loader',options: vueLoaderConfig},{test: /\.js$/,loader: 'babel-loader',include: [resolve('src'), resolve('test')]},{test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,loader: 'url-loader',options: {limit: 10000,name: utils.assetsPath('img/[name].[hash:7].[ext]')}},{test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,loader: 'url-loader',options: {limit: 10000,name: utils.assetsPath('media/[name].[hash:7].[ext]')}},{test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,loader: 'url-loader',options: {limit: 10000,name: utils.assetsPath('fonts/[name].[hash:7].[ext]')}},{test: /\.css$/,loader: ['style-loader']},{test: /\.(pdf|jpg|gif)$/,loader: 'file-loader'}]}}

Thanks.