在web項目中使用Vue技術：web項目所需Vue.js插件的安裝以及Vue.js.devtools作爲擴展程序安裝到chrome中流程

在web項目中使用Vue技術：web項目所需Vue.js插件的安裝以及Vue.js.devtools作爲擴展程序安裝到chrome中流程

0所需插件和工具的百度雲鏈接如下鏈接：

https://pan.baidu.com/s/15HvqVOC3TyUJmqinr9I1mg 
提取碼：3shb

1.Node的安裝

1).下載好的鏈接中，打開Node,執行安裝(Node中自帶npm)(當然你也可以自己百度下載Node不用我百度雲中的)

2).安裝完成，選擇阿里的鏡像，cmd輸入npm install -g cnpm --registry=https://registry.npm.taobao.org

4).至此Node安裝完畢，需重啓計算器！

2.node_module的安裝

1).如果你的web項目已經在IDEA工作區域創建好，則忽略2).~~~

打開IDEA中的Terminal終端，輸入npm install vue --savesave是局部的意思，即只在當前web項目中倒入Vue技術。(因爲使用了taobao的鏡像，所以下載會很快)

如果是maven項目，則需要

1.file-othersetting-JDK版本和lambda
2.file-othersetting-maven本地倉庫的地址和setting.xml設置，以及Jdk信息等
3.file-setting-JavaScript-上方下拉欄，選擇ES6

2).如果你想從別的C/D盤中導入已經存在的web項目，則打開IDEA選擇file-open-選擇你想要導入的web項目路徑即可

如果是maven項目，則需要

1.file-othersetting-JDK版本和lambda
2.file-othersetting-maven本地倉庫的地址和setting.xml設置，以及Jdk信息等
3.file-setting-JavaScript-上方下拉欄，選擇ES6

項目倒入成功後，打開IDEA中的Terminal終端，輸入npm install vue --savesave是局部的意思，即只在當前web項目中倒入Vue技術。(因爲使用了taobao的鏡像，所以下載會很快)

3.Vue.js插件的安裝

1).IDEA中，file-setting-plugin

選擇安裝即可(安裝成功，則可以忽略下面的2).步驟)

2).如果執行1).中Vue.js插件下載時，顯示download失敗，說明你的IDEA版本和提供的Vue,js插件版本不符合。

此時IDEA-Help-about查看自己IDEA的版本

然後去IDEA-Plugin的官網中https://plugins.jetbrains.com/搜索Vue.js插件，點擊Version，下拉選擇和你的IDEA版本匹配的Vue.js插件下載。(我百度雲中的是2017.3版本IDEA對應的Vue.js插件，如果符合，可以拿來直接用)

下載完成後，解壓。然後file-setting-plugin-選擇下載好的Vue.js即可

3).Vue.js插件下載成功，你的web項目中含有Vue組件代碼的文件，會出現這種標誌，代表插件下載成功

4.chrome安裝Vue.devtools工具，方便對Vue組件代碼的直接操作

1).首先你可以去官網下載Vue devtools工具(但涉及文件的預編譯，有點麻煩)，可以直接拿用我百度雲中的devtools

2).打開chrome瀏覽器，和設置一個頁面-更多工具-擴展程序-

至此，Vue-devtools安裝成功

5.vue技術的使用

1).打開上述IDEA中安裝過vue.js插件的web項目，Terminal輸入npm run dev則，web項目啓動成功。chrome中打開項目路徑，則可以操作了~~~