サーバー静的pdf - Vue CLI - Webpack - 問題

Question

私はVueCLI（+ Vuetify）のおかげで少し前にビルドしました。

onClickは、プロジェクトのフォルダツリーにあるpdfで新しいタブを開くボタンをレンダリングしたかったのです。

私はエラーがあり、何時間後にそれを見て、それは変更するWebpackのconfのようです。

私は最終的にS/Oでこの回答を読んだ。 Serving static pdf with react webpack file loader

しかし、私は、私は任意のヘルプを見つけることになるので、WebPACKのは、シーンの背後にどのように動作するか見当もつかないことを認めざるを得ないinclude: paths -> paths is not defined

を言ってエラーを得ました。

Answer 1

あなたはおそらくこれをWebpackにする必要はありません。静的フォルダに入れて、<a href="/static/mypdf.pdf">pdf</a>にリンクするだけです。あなたはWebPACKのルートを移動したい場合は、あなたのsrc/assetsディレクトリに入れて、それをインポートして、データ・オブジェクトに追加します。

import pdf from '../assets/mypdf.pdf' 

//... 
data:() => ({ pdf }) 
//... 

は、その後、あなたのコンポーネント内のリンクを使用します。

<a :href="pdf">pdf</a> 

ますおそらくローダーの設定にinclude: pathsを追加しましたが、あなたは、それを定義する代わりに、自分のイメージローダを変更する、PDFファイルのために新しいものを追加しませんでした：

{ 
    test: /\.(pdf)(\?.*)?$/, 
    loader: 'url-loader', 
    options: { 
     name: utils.assetsPath('[name].[hash:7].[ext]') 
    } 
    } 

あなたはを変更することができます210としたい場合は、使用するベースアセットディレクトリを使用する代わりにpdfsディレクトリをアセットに追加したいとします。pdfs/[name].[hash:7].[ext]