Vue パッケージアップロードサーバー更新 404 問題に対する 2 つの解決策

Vue パッケージアップロードサーバー更新 404 問題に対する 2 つの解決策

1: nginxサーバーソリューション、.conf構成ファイルを変更する

解決策は2つある

1:

    位置 / {
		try_files $uri $uri/ @router;
		インデックス index.html;
	}
	場所 @router {
		最後に ^.*$ /index.html を書き換えます。
	}

2:

    位置 / {
        エラーページ 404 /index.html;
        #try_file $uri $uri/ /index.html =404;
    }

2: Apacheサーバーソリューション

(csdnディレクトリに配置されていると仮定)は、次の手順に分かれています。

1. ルーティングを構成する: 履歴モードを使用してベースを構成する

2. config/index.js ファイルの assetPublicPath を、サーバー上に置いたファイル パスに変更します。ルート ディレクトリは '/' です。フォルダー内に配置されている場合は、たとえば、/csdn/' になります。

3. Apacheのhttpd.confファイルを.htaccessをサポートするように変更します。

4. .htaccess ファイルを対応するフォルダー プロジェクトに追加します。(Windows はファイル名のない形式 (.***) をサポートしていないため、最初に新しいテキスト ドキュメントを作成し、コンテンツを書き込んでから、FTP 経由で対応するディレクトリにアップロードし、名前を変更する必要があります。ここで名前を変更すると表示されなくなるため、FTP で隠しファイルを表示するように設定する必要があります)

<IfModule mod_rewrite.c>
	RewriteEngine オン
	書き換えベース /csd/
	書き換えルール ^index\.html$ - [L]
	書き換え条件 %{REQUEST_FILENAME} !-f
	書き換え条件 %{REQUEST_FILENAME} !-d
	書き換えルール./csd/index.html [L]
</モジュール>

5. サーバーを再起動する

要約する

これで、vue パッケージ アップロード サーバーの更新に関する 404 問題に対する 2 つの解決策に関するこの記事は終了です。vue パッケージ アップロード サーバー 404 に関する関連コンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • Vueは添付ファイルのアップロード機能を実装しました
  • Spring+Vue は UEditor リッチテキストを統合して画像添付ファイルをアップロードします
  • Vue+element+oss はフロントエンドのフラグメントアップロードとブレークポイント再開を実現します
  • vue-simple-uploader をベースに、ファイルセグメントアップロード、インスタントアップロード、ブレークポイント再開のグローバルアップロードプラグイン機能をカプセル化します。
  • Vue フォームのポストリクエストとサーブレットを組み合わせてファイルアップロード機能を実現する
  • Vueはvue-quill-editorリッチテキストエディタを使用し、画像をサーバーにアップロードします。
  • Vue2をベースにモバイル画像アップロード、圧縮、ドラッグアンドドロップソート、ドラッグアンドドロップ削除機能を実現
  • vue+vantで写真をアップロードする際の注意点
  • Vueは写真を切り取ってアップロードすることを実現
  • Vueで複数の添付ファイルをアップロードする実装例

<<:  Tomcat が https アクセスをサポートするための手順の説明

>>:  MySQLの起動失敗の解決策

推薦する

MySql データベースにおける単一テーブル クエリと複数テーブル結合クエリの効率の比較

この間、プロジェクトに取り組んでいるときに、データ間の接続が非常に複雑なモジュールに遭遇しました。テ...

HTML タイトル属性をラップする方法

数日前にプログラムを書いていたとき、プロンプト情報 (TITLE) を新しい行で囲みたいと思いました...

ウェブデザインにおけるインタラクション: ページングの問題に関する簡単な説明

機能: 前のページまたは次のページにジャンプします。要素: ページングの基本要素は、前のページ + ...

シームレスなカルーセル効果を実現するネイティブ js

参考までに、ネイティブjsでカルーセル効果(シームレススクロール)を実現しています。具体的な内容は以...

ウェブページからテキスト透かしを削除する2つの簡単な方法

<br /> 特定の Web サイトを閲覧して、優れた Web ページを見つけた場合、そ...

すべてまたは逆の選択機能を実現するJavaScript

この記事では、全選択または選択を反転する機能を実現するためのJavaScriptの具体的なコードを参...

JavaScript の isPrototypeOf 関数

目次1. isPrototypeOf()例 1、オブジェクト クラス インスタンス:例 2: Hum...

Dockerサーバーのストレージリソースプール不足問題の解決

目次1. 問題の説明2. 問題分析3. 問題解決1. Dockerのディスク使用量を確認する2. 再...

MySQL 5.7 zip アーカイブ バージョンのインストール チュートリアル

この記事では、MySQL 5.7 zipアーカイブ版のインストールチュートリアルを参考までに紹介しま...

Nginx 仮想ホストを構成する 3 つの方法 (ポートベース) の詳細な説明

Nginx は、IP ベースの仮想ホスト構成、ポート ベースの仮想ホスト構成、ドメイン名ベースの仮想...

React Fiber構造の作成手順

目次リアクトファイバーの作成1. 始める前に2. React.renderから始める3. 終了リアク...

CSS パフォーマンスの最適化 - will-change の使用方法の詳細な説明

will-change は、要素にどのような変更が行われるかをブラウザに伝え、ブラウザが事前に最適化...

React Nativeの起動プロセスの詳細分析

はじめに: この記事ではreact-native-cliで作成したサンプル プロジェクト (Andr...

Electronで不規則な形状の透明部分をクリックする実装

目次不規則なフォームの実装透明な部分をクリックする不規則なフォームの実装ここでは円形フォームを実装し...

Linux で at および cron スケジュールタスクをカスタマイズする方法

Linux システムには 2 種類のスケジュールされたタスクがあります。1 つは 1 回だけ実行され...