1. 程式人生 > >Vue項目搭建過程

Vue項目搭建過程

-s pro project 下載 build bre pos str ref

環境搭建:mac+nodejs+npm

#安裝node.js :                      $ brew install node   
#安裝vue-cil:                       $ npm install -g vue-cli
註:
官網下載安裝node.js:https://nodejs.org/en/
mac-使用brew安裝軟件


優化:

使用國內鏡像提升下載速度:
    $ npm install -g cnpm --registry=https://registry.npm.taobao.org
    $ cnpm install -d
安裝 nrm 自由切換 npm 源    $ cnpm install nrm
使用nrm
:     $ nrm ls     $ nrm use **

構建項目:

安裝vue                $ npm install [email protected]2.1.6 
全局安裝 vue-cli        $ npm install --global vue-cli 
創建新項目              $ vue init webpack my-project 
進入項目目錄            $ cd my-project 
安裝依賴                $ npm install 
運行項目                $ npm run dev
打包項目           $ npm run build
測試打包項目:
  安裝一個 http-server
服務 $
npm install http-server -g
使用:cd dist http-server -p 3000

註意:

去掉打包時生成的 map 文件:/config/index.js 文件修改為:productionSourceMap: false


安裝組件:

安裝 vue 路由模塊      $ npm install vue-router -D 
安裝網絡請求模塊        $ npm install vue-router vue-resource --save
支持scss 文件預編譯 
             $ npm install sass
-loader -D              $ npm install node-sass -D
支持jquery $
npm install --save jquery 安裝一個ajax接口請求工具 $ npm install axios -D

Vue項目搭建過程