Vuejs環境搭建

1.安裝Node.js ,由於Nodejs裏面有附帶的npm (node包管理器)，如下是我本身親測有效的步驟，個人電腦配置時win7 64位

Node下載連接： 32 位安裝包下載地址 : https://nodejs.org/dist/v4.4.3/node-v4.4.3-x86.msi64 位安裝包下載地址 : https://nodejs.org/dist/v4.4.3/node-v4.4.3-x64.msi

Node安裝步驟：http://www.runoob.com/nodejs/nodejs-install-setup.html

2.安裝完成查看系統路徑

點擊開始=》運行=》輸入"cmd" => 輸入命令"path"，輸出以下結果：

PATH=C:\oraclexe\app\oracle\product\10.2.0\server\bin;C:\Windows\system32; C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\; c:\python32\python;C:\MinGW\bin;C:\Program Files\GTK2-Runtime\lib; C:\Program Files\MySQL\MySQL Server 5.5\bin;C:\Program Files\nodejs\; C:\Users\rg\AppData\Roaming\npm

咱們能夠看到環境變量中已經包含了C:\Program Files\nodejs\

3.檢查node的版本

點擊開始=》運行=》輸入"Node.js command prompt" ,以管理員身份打開，在dos界面輸入npm -v,若是查到的版本低於3.0，用npm install npm -g 更新npm的版本，再次輸入 npm -v 確認版本大於3.0

4.安裝淘寶鏡像：國內直接使用 npm 的官方鏡像是很是慢的，這裏推薦使用淘寶 NPM 鏡像，不用鏡像後面的安裝還可能報錯，安裝命令：$ npm install -g cnpm --registry=https://registry.npm.taobao.org

5.安裝 Vue ,繼續輸入命令 npm vue,成功後，安裝vue的命令行工具，使用命令npm install --global vue-cli,安裝成功後能夠嘗試建第一個VUE項目

6.建第一個VUE項目

# 建立一個基於 webpack 模板的新項目 $ vue init webpack my-project # 這裏須要進行一些配置，默認回車便可 This will install Vue 2.x version of the template. For Vue 1.x use: vue init webpack#1.0 my-project ? Project name my-project ? Project description A Vue.js project ? Author runoob <test@runoob.com> ? Vue build standalone ? Use ESLint to lint your code? Yes ? Pick an ESLint preset Standard ? Setup unit tests with Karma + Mocha? Yes ? Setup e2e tests with Nightwatch? Yes vue-cli · Generated "my-project". To get started: cd my-project npm install npm run dev Documentation can be found at https://vuejs-templates.github.io/webpack

進入項目，安裝並運行：

$ cd my-project $ cnpm install $ cnpm run dev DONE Compiled successfully in 4388ms > Listening at http://localhost:8080

成功執行以上命令後訪問 http://localhost:8080/，輸出結果以下所示：