Mac環境下搭建vue.js開發環境教程

1、安裝node.js

安裝成功驗證:

這裡寫圖片描述

2、基於node.js,利用淘寶npm鏡像安裝相關依賴

在cmd裡直接輸入:

npm install -g cnpm –registry=https://registry.npm.taobao.org

等待安裝

3、安裝全局vue-cli腳手架,用於幫助搭建所需的模板框架

打開終端,輸入:cnpm install -g vue-cli

安裝成功驗證:

輸入vue

這裡寫圖片描述

4、搭建第一個vue項目

打開終端 按下圖操作 創建一個名為“my_demo”的項目

這裡寫圖片描述

驗證,在Finder中打開我的電腦,找到名為“my_demo”的文件夾,然後多瞭一個node_modules文件夾(該文件裡的內容就是之前安裝的依賴):

這裡寫圖片描述

或者通過終端 cd my_demo 然後利用ls操作進行查看:

這裡寫圖片描述

5、運行

在這裡我們可以選用IDE運行或者直接用終端運行

(1)在終端運行

這裡寫圖片描述

運行效果如下:

這裡寫圖片描述

(Hello my vue.js!是我自己在index.html裡添加的內容,後面的博客裡會講解如何添加)

(2)在IDE運行

啟動方式同終端,隻需在IDE的終端裡運行即可,而且便於根據項目結構進行修改代碼。

歡迎來到vue.js的世界!

You May Also Like