0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

【環境構築】viteでVue3の環境構築

Last updated at Posted at 2023-07-07

NodeJSのインストール

こちらからダウンロードしてください。

ダウンロードが完了したら、以下のコマンドでバージョンが確認できます。

node -v

nodeと共にnpmもインストールされるはずなので、とちらもバージョンを確認してください。

npm -v

Yarnのインストール

こちらはコマンドからインストールします。

npm install -g yarn

完了したら、バージョンを確認します。

yarn -v

プロジェクト作成

保存するディレクトリは好きな場所で構いません。
ディレクトリに移動したら、以下のコマンドを実行します。

yarn create vite

順調に進むと、以下のようにプロジェクトの名前を聞かれますので、任意の名前を入力してください。

image.png

プロジェクト名を記入すると、次に使用するフレームワークを聞かれます。
今回はVueを選択してください。

image.png

次も使用するフレームワークを問われます。
今回は、TypeScriptを選択します。

image.png

インストールが完了したら、作成したプロジェクトに移動し、様々なパッケージを一括でインストールしてくれる以下のコマンドを実行します。

yarn

完了したら、以下のコマンドにより作成したVueのアプリケーションをブラウザから見れるようになります。

yarn dev
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?