はじめに
コジマです。
環境構築って大事なんだけど、あまりやらないから忘れちゃうのよね。
忘れてもいいように手順を残しておく。
1:nodeのインストール
https://nodejs.org/ja/
からnodeのインストールをする。
npmはnodeをインストールすると勝手についてくる。
npm（Node Package Manager）だからね！
設定はとりあえずデフォルト。
2:VSCodeのインストール
https://azure.microsoft.com/ja-jp/products/visual-studio-code/
からVSCodeをインストール。
これはエディタなので、みんなのお好みでよい。
個人的にVSCodeは使いやすくて気に入っています。
3:vue-cliのインストール
https://cli.vuejs.org/guide/installation.html
npm install -g @vue/cli
を実行。
vueコマンドが使えるようになる。
4:プロジェクトを作成する
C:/workの下にプロジェクトフォルダを作りたいからその下準備
cd c:\ mkdir work cd work
https://cli.vuejs.org/guide/creating-a-project.html#vue-create
vue create hello-world
を実行。
こんな感じでプロジェクトフォルダができる
PS C:\work\hello-world> dir
ディレクトリ: C:\work\hello-world
Mode LastWriteTime Length Name
---- ------------- ------ ----
d----- 2021/01/25 1:14 node_modules
d----- 2021/01/25 1:13 public
d----- 2021/01/25 1:13 src
-a---- 2021/01/25 1:13 231 .gitignore
-a---- 2021/01/25 1:13 73 babel.config.js
-a---- 2021/01/25 1:14 464365 package-lock.json
-a---- 2021/01/25 1:13 856 package.json
-a---- 2021/01/25 1:14 323 README.md
5:プロジェクトを起動する
以下のコマンドを実行
cd hello-world npm run serve
localhost:8080にアクセスして以下のようなページが表示されればOK
さいごに
こういうの初歩の初歩なんだけど、新しいPCゲットしたついでに環境を作って手順をまとめることにしました。
この記事を面白いまたは役に立ったと思ってくれた方は是非私のTwitter(@kojimanotech)を
フォローしてくれたらうれしいです！
システムエンジニアのつらい部分のあるあるなんかをエンタメにしたチャンネルを作りました。
チャンネルはこちら
つらい部分も楽しくなればと思っているのでよかったらチャンネル登録や高評価してくれたらうれしいです。
以上、コジマでした。
