Vue Cli 3アプリがあります。このアプリをビルドすると、「dist」ディレクトリにWebコンポーネントのバンドルが作成されます。
実行時に「dist」ディレクトリ内のファイルを参照できる方法を探していnpm run serveます。これにより、webpackdevサーバーが起動します。
今これを行うと（つまり、http：// localhost：8083 / dist / component.jsを参照するようなもの）、パブリックディレクトリにあるindex.htmlファイルが表示されます。
vue.config.jsファイルを介して、devserverに「dist」ディレクトリ内のファイルを提供させる機能を構成するにはどうすればよいですか？
devServerは、特定のローダー、プラグインなどを適用するための構成を開発環境に提供することを目的としています。探しているのは、ローカルでホストされているファイルを動作するアプリケーションとして提供する方法です。これらは2つの異なる目的でありdevServer、そのような目的のために構成を調整することはお勧めしません。
ローカルマシンで静的ファイルを提供する簡単な方法があります。最も簡単な方法の1つは、ライブサーバー、サーブなどを使用することです。
それがlive-serverほんの数ステップで機能するために必要です：
1）インストール
npm install -g live-server
2）ターミナルで、静的ファイルが配置されているフォルダーに移動します（例： project-folder/dist/
3）live-serverコマンドを実行します。
これによりindex.html、エントリポイントとしてブラウザタブが開き、ローカルマシン上のWebサーバーがシミュレートされます。ドキュメントで利用できるオプションは他にもたくさんあります。
しかし、これは目的を果たし、目的を妨げることはありませんdevServer。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加