安裝Node,建立vue項目,運行及打包

一、安裝node jshtml

  下載地址:http://nodejs.cn/download/vue

二、安裝完成後運行Node.js command prompt(node -v查看安裝版本)node

  

三、安裝npm(因爲如今版本的nodejs已經集成npm因此無需安裝,能夠用npm -v 查看版本)
  webpack

四、註冊cnpm來代替npmweb

  使用命令:npm install cnpm -g --registry=https://registry.npm.taobao.orgvue-cli

  若是你發現你安裝成功了,使用cnpm卻發現找不到命令,那麼就是你的環境變量有問題,在環境變量裏面的path添加你node的安裝路徑就行,好比";C:\Program Files\nodejs\node_modules"npm

五、安裝vue腳手架vue-clijson

  命令:cnpm install -g vue-cli瀏覽器

  安裝成功後能夠用 vue -V 查看vue版本服務器

六、cd到對應的目錄下初始化vue項目

  命令:vue init webpack my-project

      Project name 項目名

      Project description 項目名描述

      Author 做者郵箱

      Use ESLint to lint your code? 是否須要ESlist語法檢查

      Setup unit tests with Karma + Mocha? 是否須要單元測試

      Setup e2e tests with Nightwatch? Yes是否須要e2e測試

七、package.json爲項目依賴資源,若是要運行這個項目須要使用cnpm install 安裝依賴項(直接在項目文件夾路徑下執行)

八、使用命令cnpm run dev啓動項目,瀏覽器會打開 http://localhost:8080/#/ 看到如下效果

  開發時屬於熱部署狀態,代碼保存後瀏覽器會自動刷新,錯誤提示也很是友好。

九、編譯打包 cnpm run build

  會編譯打包到項目dist文件夾下,而後咱們就能夠部署到服務器上(注意:若是你直接打開index.html,可能頁面會是一片空白,這是因爲你引用的js路徑有問題)

相關文章
相關標籤/搜索