剛來公司實習發現公司的前端使用的是vue，之前根本就沒有聽說過。然后一上來就需要看代碼，but but 就是沒有文檔什么的東西，就需要自己去研讀，我就想去運行其中的前端和后端聯調起來方便理解，結果在配置和運行中出現了很多挫折，我就想寫一下方便
大家不去采坑，直接運行好
一、在idea中配置vue插件
點擊file-->settings-->plugins-->搜索vue.js插件進行安裝，下面的圖中我已經安裝好了。
二、搭建node.js環境
安裝node.js 可以去官網下載：安裝過程就很簡單，直接下一步就行
測試是否安裝成功：要使用管理員方式打開命令行cmd
安裝完成之后，打開命令行工具,輸入node -v如果出現版本號，則說明安裝成功，npm包管理器是集成在node中的，所以，直接
輸入npm -v 就會顯示npm版本信息
好了，node環境已經安裝成功，由于有些npm有些資源被屏蔽或者是國外資源的原因，經常會導致用npm安裝依賴包的時候失敗，
所以還需要安裝npm的國內鏡像----cnpm
三、安裝cnpm（注意都是管理員方式運行）
在命令行中輸入npm install -g cnpm --registry=http://registry.npm.taobao.org然后等待安裝，安裝完成之后，我們就可以用cnpm代替npm來安裝
依賴包了。
四、安裝vue-cli腳手架構建工具（注意都是管理員方式運行）
在命令行中運行命令cnpm install -g vue-cli,然后等待安裝完成，通過以上三步，我們的環境和工具都準備好了，接下來就開始使用
vue-cli來構建項目
五、構建運行項目
1.我這里是已經有項目了，需要在命名行中，cd 到項目目錄中去
然后需要輸入命令：vue init webpack frontend (這里命令的意思是初始化一個項目，項目名稱是frontend，其中webpack是構建工具，
也就是整個項目時基于webpack的)
運行命令初始化的時候會讓用戶輸入幾個基本的選項，如項目名稱、描述、作者等信息，可以直接回車默認就可以了。
六、安裝項目依賴資源
在項目的根目錄下面會有一個package.json的文件
這里列出了項目依賴資源需要安裝
首先需要cd到項目目錄中去，然后輸入cnpm install 等待安裝，安裝中會出現警告信息，有的會出現棧溢出等錯誤，我就是在這里遇到了，一般
第一次安裝沒事，如果安裝過的，可以卸載了在重新安裝
七、運行項目
運行命令npm run dev會用熱加載的方式運行我們的應用，熱加載可以讓我們在修改完代碼后不用手動刷新，瀏覽器就能實時看到修改后的效果
我們也可以在idea中配置運行
點擊edit configurations配置，添加一個npm
然后就可以在idea中運行了。
總結
以上所述是小編給大家介紹的使用idea工具配置和運行vue項目及遇到的坑，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對服務器之家網站的支持！
原文鏈接：https://www.cnblogs.com/ya-qiang/p/9639187.html
