前回の記事
vue.jsを初めて学ぶ ① [hello world]
vue.jsを初めて学ぶ ② [テンプレート構文]
vue.jsを初めて学ぶ ③ [レンダリング]
目次
2020年10月 現在では、vue.jsがver3 vue-CLIがver4 にアップデートされている。
今回は、vue.jsのver2系とvue-CLIのver3.7.0をインストールしたい
Vuecli ver3のインストール
各自のターミナルにて、コマンドを入力していく。
vueCLI.ver3.7.0の導入
npm install -g @vue/cli@3.7.0
*ここで3.7.0のvue-cliをインストールしないと、vue create する時に、プロジェクトに対してvue.js3系が適用される。
[バージョン]
vue -V
=> @vue/cli 3.7.0
プロジェクト作成
vue create [name]
プロジェクトが作成される。
vue ver2系が[name]インストールされる。
[確認]
npm list vue
=> vue@2.6.12
cd [プロジェクトname]
npm run serve
local [urlが表示]
network [urlが表示]
- localにアクセスすると、vueのapp画面が表示される。
## 開発環境と本番環境
```text:開発環境
npm run serve
=> HMRが起動する。開発しやすい
本番環境
npm run build
=> distディレクトリが生成される。これをs3に投げると静的ホスティングが可能
今回のように、vue-cliなどnpmパッケージのverを指定したいときは、
検索してパッケージ名を調べて、目的のverをインストールするようにしましょう！