mac如何運行VUE項目

mac如何運行VUE項目

大家好，我是灰大狼。

最近在做一個前後端分離的項目，前端用的是vue，由於以前沒有接觸過，所以今天初步學習了下vue，vue我就不介紹了，這裏主要給大家分享的是vue項目如何運行，由於我用的是mac，跟windows安裝環境不太一樣，這裏主要說的是mac下如何安裝環境以及運行一個vue項目。

安裝node.js

1. 下載

   進入nodejs官網下載node.js，我下載的版本是12.14.0

   2. 安裝

      按照步驟一步步來，即可安裝完成，此時node和npm都一起給安裝好了

   3. 驗證

      node -v #查看node版本
      npm -v #查看npm版本
      

      由於node安裝的時候就自帶npm了。如果出現版本信息，就說明安裝成功了。

   4. 更新至最新版本

      npm -g install npm #更新至最新版本
      

   ---

   運行vue項目

   這裏提一下，如果是windows的話，也是按照這個步驟進行

   1. 安裝淘寶鏡像

      sudo npm install -g cnpm --registry=https://registry.npm.taobao.org #使用sudo目的是npm安裝在了/usr/local/lib下，沒有對應的操作權限
      

   2. 安裝項目依賴

      必須要進入到vue項目根目錄安裝，執行如下命令，然後就靜等安裝完成，安裝完成後，根目錄下會多出一個node_modules文件夾，裏面有vue項目運行的所有依賴

      cnpm install
      

   3. 運行項目

      執行命令：

      cnpm run dev
      

      cnpm run dev後面的dev在我的項目中表示的是dev環境，是在package.json文件裏面，scripts字段定義的對象腳本，當然了，還有其他的環境，不同的環境對應的配置不同，在各境上運行只需要執行對應的命令即可。

      比如，我的項目中還有這些：

        "scripts": {
          "dev": "node build/dev-server.js",
          "build:prod": "cross-env NODE_ENV=production node build/build.js",
          "build:sit": "cross-env NODE_ENV=sit node build/build.js",
          "build:sit-preview": "cross-env NODE_ENV=sit npm_config_preview=true  npm_config_report=true node build/build.js",
          "lint": "eslint --ext .js,.vue src"
        }
      

      執行完成之後，前端vue項目就起來了，並且根據環境中的配置，監聽後端的地址。

相遇即是緣分，如果這篇文章對您有幫助，請您動動手指點個贊支持一下，這對我非常重要，感謝您的支持！