使用 IDEA 搭建 Vue 項目

在這裏插入圖片描述

安裝插件

查看你的 IDEA 的版本號
在這裏插入圖片描述
然後下載對應版本的 Vue 插件,可能需要梯子。

https://plugins.jetbrains.com/plugin/9442-vue-js/versions

也可以從 CSDN 下載:https://download.csdn.net/download/weixin_43941364/12384707

在這裏插入圖片描述
然後進入插件設置頁面,選擇從本地磁盤安裝插件。
在這裏插入圖片描述
安裝成功之後重啓 IDE 即可。

安裝 Vue

我們使用 Vue Cli3 腳手架工具,所以要先安裝該工具。

前提是你已經學了 NodeJs 等工具。

npm install -g @vue/cli
或者使用 cnpm, 建議使用 cnpm

創建項目

有三種方式:

方法一:

首先新建一個文件夾,比如我這裏就叫做 vue-demo01,然後進入該文件夾,執行vue create hello-world創建項目,然後使用 IDEA 打開項目,最後再 IDEA 的Terminal 中執行npm run serve 運行。

總結一下就兩句:

vue create hello-world
npm run serve

在這裏插入圖片描述

方法二:

當然你也可以使用圖形化界面創建項目:

在命令行窗口執行命令vue ui,然後他會自動打開瀏覽器窗口。

在這裏插入圖片描述
選擇創建即可。
在這裏插入圖片描述

方法三:

使用 IDEA 直接創建。
在這裏插入圖片描述
配置相關軟件的地址,只要你電腦上面有環境,IDEA 就會智能檢測,你只需點擊下三角選擇即可。

在這裏插入圖片描述
他會自動執行相關命令,就代替你執行了 vue create demo的命令了。
在這裏插入圖片描述
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章