Expressは、Vue 2 App内の静的ファイルを提供します。

生産と開発の構造が異なるため、vue 2プロジェクト（webpack-simple template）で表現される高速静的データに問題があります。Expressは、Vue 2 App内の静的ファイルを提供します。

開発：はlocalhost /アプリ

生産：サーバー/いくつかのディレクトリ/アプリ

それは設定ファイルに動的に設定されているように、いくつかのディレクトリは、かなり頻繁に変更されます。 server.jsの

マイなる部分：

if (config.root !== '/') { 
    app.use(`/${config.root}`, express.static(path.join(__dirname))); 
} 

app.use('/dist', express.static(path.join(__dirname, 'dist')));

Transpiled JSファイルは、/でのdistフォルダです。アプリがルートであるため、

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>App Demo</title> 
    </head> 
    <body> 
    <div id="app"></div> 
    <script src="/dist/build.js"></script> 
    </body> 
</html>

それは開発中の作品：

これはアプリのエントリポイントとして機能index.htmlファイルです。

しかし、アプリケーションはサーバーのサブフォルダから提供されるため、運用ビルドでは動作しません。

これを解決する方法はありますか？

ありがとうございました。

出典

2017-04-19 user2199236

しかし、プロダクションビルドでは、アプリケーションがサーバーのサブフォルダから提供されるため、動作しません。

「それは機能しません」というフレーズは、実際には何も教えてくれません。何がうまくいかない？クライアントで何かエラーが出ますか？サーバーでエラーが発生しましたか？あなたはHTMLの404を取得しますか？ HTMLは問題ありませんが、画像は404です。何が間違っているのかを指定していないので、ここでは一般的なアドバイスしかできません。

あなたはExpressでルータを作成した場合：

const router = require('express').Router(); 
router.get('/a', ...); 
router.get('/b', ...); 
router.use('/c', express.static(...));

を、あなたは非常に簡単に任意のサブパスにあなたの全体のアプリを置くことができるようになります：

/xはあなたに必要な接頭辞である

app.use('/x', router);

。

また、HTMLファイルなどのすべての静的アセットに絶対パスを使用しないようにする必要があります。以下のような

<a href="https://stackoverflow.com/a/b/c.html">...</a> 
<script src="https://stackoverflow.com/a/b/c.js"></script>

だけの相対パス：：のようなもの

あなただけのアプリを残して、必要なパスのプレフィックスを追加するためにリバースプロキシを使用する場合、これはまた真であるなど

<a href="b/c.html">...</a> 
<script src="../../a/b/c.js"></script>

- これはあなたが可能性また、あなたのNodeコードを迷惑にするのではなく、この場合には簡単かもしれません。ノードのアプリとリバースプロキシの詳細情報については、これらの質問を参照してください。

出典

2017-04-19 09:42:24 rsp

これは、ルートURLからデータが取得され、配信される静的コンテンツではないことを意味します。私はあなたの解決策を試しましたが、そこに運がありません。これはwebpackテンプレートアプリケーションなので絶対パスを使用する必要があります。そうしなければアプリケーションは蒸散資産を見つけることができなくなるからです。例：src = "../ assets/logo.png"はビルド後にsrc = "/ dist/logo.png"になります。 prefix/custom-directory/usingのノードまたはexpressを持つすべてのリンクを変更することは可能ですか？ – user2199236

Expressは、Vue 2 App内の静的ファイルを提供します。

答えて

関連する問題