Vue jsビルド作業中

Question

私は取得しようとしていますvue js生産のためのソースコードです。 このコマンドはnpm run buildです。 distフォルダにindex.htmlとstaticという名前のフォルダがあり、すべてcssとjsです。私はindex.htmlローカルホストで実行してみました

、すなわちは、XAMPPサーバ私は空白のページを得ました。

はXAMPPで実行するVUEのJSを持つことが可能です。

Answer 1

Vue.jsはブラウザ側のアプリケーションフレームワークです。サーバー側のレンダリングを試みていない限り、サーバー側の技術は関係ありません。ファイルがロードされてきているかを確認するには

npm run build完全に大丈夫作品、およびそれがmanifest.#.js用のファイルの縮小さセットを作成し、vendor.#.jsとapp.#.js

オープンGoogle Chromeのの開発ツールでネットワーク]タブ。 jsファイルのいずれかがロードされていない場合、それはあなたのサーバーが適切なファイルを提供できるように、必要なパス設定です。

index.htmlファイルを少し調整して、要件を完全に満たすように調整し、jsファイルをdist/staticフォルダから希望する場所に移動する必要があります。アプリケーションファイルが正しい順序で提供されている限り、URLパスは重要ではありません。

Answer 2

通常、プロダクションビルドを実行すると、index.htmlファイルに設定されたパスの前にスラッシュが付加され、ベースドメイン内のファイルが検索されます。ですから、ブラウザでファイルを開くときに、index.htmlファイルをダブルクリックしてブラウザで開いてみてください。

ので file:///Users/brianvoelker/Desktop/websites/vue-build/docs/index.html ような何かその例では、file:///でファイルを検索しようとしていると、もちろんいけないが存在します。

したがって、index.htmlファイルを開き、最初にスラッシュを削除するか、ファイルルックアップがベースドメインからの相対パスであるため、デプロイ時に知っていることがわかります。

P.S.あなたがCLIビルドツールをお探しの場合Vue-build.com

Answer 3

私は同様の問題に遭遇し、上記の情報が私を助けました。しかし、VueJS CLI webpackツールのconfigフォルダ内のindex.jsファイルを編集し、 'assetsPublicPath：'変数を '//'から './'に変更すると、将来のビルドで正しい参照が見つかることがわかりました静的フォルダのcssファイルとjsファイルにコピーします。

Answer 4

私は以前にもこの問題を抱えていました。 configフォルダのindex.jsファイルを変更して解決しました。ビルドの下で、私は変更：

assetsPublicPath: '', 

して、再度ビルドを実行しようとしたNPMに

assetsPublicPath: '/', 

を。私はdistファイルをチェックし、インデックスを開いた。htmlとそれはうまくいって、空白のページ。