vue.js安裝配置

vue.js安裝及配置

Vue.js官方安裝教程https://cn.vuejs.org/v2/guide/installation.html

首先下載node.js要求版本在8.9以上        官網：https://nodejs.org/zh-cn/

建議勾選

本機模塊工具

這是在告訴會給你自動安裝2個工具：

  >構建工具(Python 2和Visual Studio構建工具)

  >Chocolatey

構建工具是因爲一些npm模塊需要使用C/C++編譯，如果想要編譯這些模塊，則需要安裝這個工具。如果不安裝這個構建工具，在之後使用 npm 安裝模塊的時候，會報錯：

gyp ERR! find Python

如果見到這個錯誤，知道是因爲沒有安裝 構建工具。

構建工具和 Chocolatey 都是必裝的，如果現在沒有安裝，可以之後再手動安裝，提示裏已經給出了相關解釋：https://github.com/nodejs/node-gyp#on-windows

該提示還告訴你 Chocolatey 會在後面彈出一個 cmd 來安裝。

爲了避免以後麻煩，這裏強烈建議選擇“Automatically install ...” ，然後 Next...

>構建工具和 Chocolatey 安裝界面如下

>可以在構建工具和 Chocolatey的安裝的同時   打開命令行 ctrl+R   >   cmd

在安裝完可檢查node是否安裝成功，

在windows任務命令行裏輸入

    >node -v

使用淘寶NPM鏡像源下載比較快   

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

安裝vue-cli（全局安裝vue-cli）   

    >cnpm install vue-cli -g

檢查Vue環境是否安裝上：

    >vue -V

創建vue項目：

    >vue init webpack vue_demo（創建名字爲‘vue_demo’的文件夾） ；一路 "Enter"鍵

 然後進入此文件夾：

    >cd vue_demo

 然後手動下載：

    >cnpm install

最後運行程序：

    >npm run dev        

運行之後會導出網址：http://localhost:8080

瀏覽器輸入http://localhost:8080; 效果如圖：