idea 運行 vue項目


一.點擊File-->Settings-->Plugins-->搜索vue.js插件進行安裝

二、搭建nodejs 環境

 1.安裝node.js 可以去官網下載:選擇符合操作系統的版本,安裝過程就很簡單,直接下一步就行

2.安裝完成之后,打開命令行工具,輸入node -v如果出現版本號,則說明安裝成功,npm包管理器是集成在node中的,所以,直接

輸入npm -v 就會顯示npm版本信息

3.node環境已經安裝成功,由於有些npm有些資源被屏蔽或者是國外資源的原因,經常會導致用npm安裝依賴包的時候失敗,

所以還需要安裝npm的國內鏡像----cnpm

4.安裝cnpm 在命令行中輸入npm install -g cnpm --registry=http://registry.npm.taobao.org然后等待安裝,安裝完成之后,我們就可以用cnpm代替npm來安裝依賴包了

5.安裝vue-cli腳手架構建工具  在命令行中運行命令cnpm install -g vue-cli,然后等待安裝完成,通過以上三步,我們的環境和工具都准備好了,接下來就開始使用

vue-cli來構建項目

6.構建運行項目  重啟idea,輸入命令:vue init webpack frontend (這里命令的意思是初始化一個項目,項目名稱是frontend,其中webpack是構建工具,

也就是整個項目時基於webpack的)  運行命令初始化的時候會讓用戶輸入幾個基本的選項,如項目名稱、描述、作者等信息,可以直接回車默認就可以了

7.安裝項目依賴資源  在項目的根目錄下面會有一個package.json的文件 首先需要cd到項目目錄中去,然后輸入cnpm install 等待安裝,安裝中會出現警告信息,有的會出現棧溢出等錯誤,我就是在這里遇到了,一般第一次安裝沒事,如果安裝過的,

可以卸載了在重新安裝

8.運行命令npm run dev會用熱加載的方式運行我們的應用,熱加載可以讓我們在修改完代碼后不用手動刷新,瀏覽器就能實時看到修改后的效果  也可以在IDEA中配置運行

9.file -> settings -> File Types -> ActionScript -> *.as -> 給下面添加 node_modules; 然后 apply -> ok

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM