NEW ARTICLE
PHP 8.4で登場！match式のさらなる拡張
  1. HOME
  2. windows
  3. Vue3環境をwindowsに構築する

Vue3環境をwindowsに構築する

Vue3環境をwindowsに構築する

Vue3の環境をwindowsに構築するまでの手順を記述してます。vue-cli4.5.9を使用してます。

目次

環境

  • OS  windows10 64bit
  • node v14.6.0
  • npm 6.14.6
  • @vue/cli 4.5.9

@vue/cliインストール

グローバルにインストールにしてます。

## インストール
npm install -g @vue/cli

## バージョン確認
vue --version

<出力結果>
@vue/cli 4.5.9

ローカルインストールとグローバルインストールについてはこちら

package.jsonを作成します。

npm init

アップグレードします。

vue upgrade --next

<出力結果>
✔  Gathering package information...
 DONE  Seems all plugins are up to date. Good work!

プロジェクト作成

プロジェクトを作成します。ここで「Vue 3」を選択します。

## vueappというプロジェクトを作成
vue create vueapp

<出力結果>
?  Your connection to the default yarn registry seems to be slow.  
   Use https://registry.npm.taobao.org for faster installation? Yes

# [Vue 3]を選択
Vue CLI v4.5.9
? Please pick a preset: Default (Vue 3 Preview) ([Vue 3] babel, eslint)
? Pick the package manager to use when installing dependencies: NPM

Successfully created project vueapp.
Get started with the following commands:

 $ cd vueapp
 $ npm run serve

記述どおりに、プロジェクトに移動します。

cd vueapp

起動

移動後に以下のコマンドを実行すれば起動できます。

npm run serve

ブラウザよりhttp://プライベートIP or localhost:8080にアクセスすると下記の画面が表示されます。

停止する場合は、「ctrl」+「c」を押します。

バッチ ジョブを終了しますか (Y/N)? y

バージョン確認

以下のコマンドでバージョンを確認することが可能です。

npm list vue

<出力結果>
vueapp@0.1.0 C:\vue3\vueapp
`-- vue@3.0.2