VueJS搭建簡單后台管理系統框架(一)環境搭建


做這份筆記的時候,Vue.js還是1.0,10月份Vue已經升級到2.0,這邊也進行相應的更新,用Vue2.0進行一個簡單的環境搭建
餓了么也剛好開源了其基於Vue.js的UI框架element-ui

傳送門

1. 環境搭建

由於辦公環境是在Windows下開發,所以還是選擇在Windows進行Vue.js的開發,使用NodeJS環境進行編譯,打包等

1.1 NodeJS及NPM安裝

1.1.1 NodeJS下載

在NodeJS官網中下載對應的NodeJS版本https://nodejs.org/en/
下載完成后進行安裝,NodeJS安裝完成后,對應的NPM也會安裝完成,安裝完成后需要設置NodeJS到環境變量中,在CMD命令行鍵入以下代碼,驗證NodeJS及NPM是否安裝正確 目前最新版本4.6.0對應npm版本2.15.9,可以手動升級到最新版本npm

> node -v
v4.6.0
> npm -v
v2.15.9

npm升級到最新版本的方法
切換路徑到nodejs安裝目錄下(如:c:\program files\nodejs\),執行以下命令:
npm install npm@latest -g

1.1.2 安裝nrm

由於npm的鏡像資源在國外,訪問速度慢,可以使用npm安裝nrm,來管理npm的鏡像資源

> npm install -g nrm  

使用nrm ls命令查看可用的資源

使用 nrm use ***選擇要使用的鏡像,如nrm use taobao

1.1.3 安裝打包工具webpack

使用

npm install -g webpack

安裝webpack

1.2 使用Vue的官方命令行工具搭建一個簡單的VueJS應用

1.2.1 安裝vue-cli

使用命令

npm install -g vue-cli

安裝Vue的官方命令行工具vue-cli

1.2.2 用vue-cli搭建一個基本的工程

使用以下命令,創建一個名為vue-test的前端項目

vue init webpack vue-test

此致環境的搭建基本完成


免責聲明!

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



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