前言:現在前端最火的是3個框架:react,vue,angular。可以說著是哪個框架大大改變了前端的地位。相對於angular來說。vue同樣擁有豐富的指令,並且都是典型的mvc框架,但是vue比較輕量級一些,最主要的是,它是中國人寫的。別看這是中國人寫的框架,在國際上照樣得到了不俗的評價。
我們在開發大型vue專案的時候,通常會搭建一些開發環境,今天就來詳細的寫一下搭建環境的步驟吧
開啟你的命令提示符(window+r),輸入cmd
第一步:準備工作
首先,你必須要確保自己的電腦上裝了node和npm,這裡需要注意的是,
由於 npm 安裝速度慢,所以使用了**的映象及其命令 cnpm,安裝命令:
npm install -g cnpm --registry=我們再來檢查一下npm的版本:
npm -vnpm 版本需要大於 3.0,如果低於此版本需要公升級它:
cnpm install npm -g這樣我們的準備工作就緒了以後,準備開始我們的環境搭建
第二步:安裝vue
我們首先需要安裝vue,命令如下:
cnpm install vue安裝完成之後,我們可以試一下vue命令(即單純輸入vue),如果不報錯,則vue安裝成功,不然重新安裝
第三步:全域性安裝vue-cli
這裡需要注意一點,安裝預設的是c盤,但是我不想把專案安裝到c盤,此時,在這個地方我們需要進入到我們想安裝的所在地,即命令行當中的:
cd 你想要的位址
這個時候執行
cnpm install --global vue-cli第四步:建立乙個基於 webpack 模板的新專案命令如下:
vue init webpack my-project此時我們一直回車就可以了,遇到y/n的時候直接y
這個時候再我們的檔案當中會出現乙個資料夾:
第五步:安裝vue的專案依賴
我們在之前搭建postcss或者gulp的時候,都用到了專案依賴,vue也不例外
首先,進入到我們的專案總,即my-project
cd my-project
cnpm install我在這裡用了npm,因為cnpm老是失敗的原因
這裡我剛開始安裝的時候總是報錯,多安裝幾遍即可,安裝完成以後,在你的my-project裡面會多乙個依賴的資料夾,如下:
第六步:執行vue
執行如下命令:
恩呢,此時隨便找個瀏覽器,輸入localhost:8080即可:
若是此頁面,則說明你的vue環境已經搭建成功了。
Vuejs開發環境搭建及熱更新
1.1最新穩定版本 npm install vue 國內速度慢,使用 映象 npm install g cnpm registry 注意 以後使用npm的地方就替換成cnpm cnpm install g vue cli vue init webpack my project 輸入安裝命令後,稍等一...
vuejs基礎入門之環境搭建
對於小白,對命令列工具使用得很少,而在學習vuejs框架時,命令列工具必不可少,因此,我對一些不懂安裝vuejs環境的小白寫如下教程 1.vuejs是前端框架,環境借助於nodo.js,因此,我們先要安裝node.js的環境。3.開啟了以上命令列,輸入 npm install g cnpm regi...
搭建vuejs專案
1 環境安裝nodejs npm vuejs npm node npm install vue 然後檢視版本 node v npm v vue v 如果有版本號,則證明安裝成功 2 也可以利用 映象安裝,這樣比較快 npm install g cnpm registry https 3 安裝vue腳...