Vue CLI UIを使ってプロジェクト作成

Vue CLI UIを使ってプロジェクト作成:


はじめに

とあるきっかけで自分で未習得のVue.jsを勉強がてら導入しようということになりまして。

まずはインストールから始めたわけですが、手順通りやったつもりがどうやらしくじったらしく、先生と同じ画面が出ない。バージョンの違い?

折角なので、そのあたりをQiitaにまとめていきましょう!という事に。

しかも、Vue CLI UIを使って修正とかできればなおハッピーみたいに言われたのでこれまた勉強です。ちょっと知識が偏ってしまっているので、よい機会です。


前提条件

  • Vue.js 3.1.1


触ってみよう

Vue.jsのインストールは特記するほどでもないので省略。

この状態でCLIを使ってプロジェクトまで作成済み。



project.png


Vue CLI UIもインストール済みで起動してみます。



vueui.png


見事にないと言われました。でもよく見たらインポートってコマンドが見えるのでやってみます。


import.png




impafter.png


できたみたいです!

変更を行いたかったので、左バーにある依存のアイコンをクリックしてみると、
import2.png


すでにimport済みなFont awesomeとかが見えました。

これで更に追加してみます。右上の依存をインストールをクリックし、プラグイン検索でfortawesomeと入力すると、
some.png


一覧で出てくるのでやりやすいですね。
free-regular-svg-iconsを追加してみます。
some2.png


簡単に追加できました。

コメント

このブログの人気の投稿

投稿時間:2020-07-01 05:34:30 RSSフィード2020-07-01 05:00 分まとめ(37件)

投稿時間:2020-07-01 20:43:40 RSSフィード2020-07-01 20:00 分まとめ(81件)

投稿時間:2020-07-01 08:33:22 RSSフィード2020-07-01 08:00 分まとめ(49件)