Vue CLIのPJでHTMLやJSファイルなどをブラウザからアクセスさせたいとき

2020年6月22日

今回はVue CLIのプロジェクトでHTMLやJSファイルなどをブラウザからアクセスできるようにするためにはどうすれば良いのかについてご紹介いたします。



Vue CLIのPJでHTMLやJSファイルなどをブラウザからアクセスさせたいとき

Vue CLIを使用しているときに、HTMLやJSファイルなどをブラウザからアクセスしようとしてプチハマりしたのでまとめていこうと思います。

私の今回のケースではVueはVue routerを使用していますが、最初私はなんとかimportでHTMLなどのファイルをimportしてrouterでルーティングすることを考えていました。

挙げ句の果てにはhtml-loaderまでinstallしましたが、結論としてはそのようなことをする必要はまったくありませんでした。
どうやらVueプロジェクトのpublicフォルダにHTMLやJSファイルなどの静的ファイルを格納すれば良いだけです。

publicフォルダの直下に「test.html」や「test.js」を作成し、ブラウザから「http://localhost:8080/test.html」のようにアクセスすると意図したファイルにアクセスできるようになりました。
どうやらpublicフォルダ以下のファイルはwebpackの対象外となるようです。

終わりに

今回はVue CLIのプロジェクトでHTMLやJSファイルなどをブラウザからアクセスできるようにするためにはどうすれば良いのかについてご紹介いたしました。

最後までお読みいただきありがとうございます。
よろしければブログやTwitterでのシェアをお願いしております。
コメントもお待ちしております。
誤植や勘違いなどございましたらコメント欄にて教えていただけると幸いです。

Youtubeチャンネル開設いたしました。
チャンネル登録者1000人を目指しているので、良いと思った方はチャンネル登録をお願いしたいです。
https://www.youtube.com/channel/UC219XhmSRxmXltTy6COxSMw






Vue CLI

Posted by ちこ