vue之淘宝镜像安装
平平淡淡summer
使用淘寶鏡像cnpm安裝Vue.js
簡(jiǎn)介:
Vue.js是前端一個(gè)比較火的MVVM框架,是一套構(gòu)建用戶界面的漸進(jìn)式框架。
Vue 只關(guān)注視圖層, 采用自底向上增量開(kāi)發(fā)的設(shè)計(jì)。
Vue 的目標(biāo)是通過(guò)盡可能簡(jiǎn)單的 API 實(shí)現(xiàn)響應(yīng)的數(shù)據(jù)綁定和組合的視圖組件
安裝方式:
第一種:使用npm,比較適合比較大型的應(yīng)用,由于npm是國(guó)外的,使用起來(lái)比較慢;
第二種:使用淘寶的cnpm鏡像來(lái)安裝vue;
步驟:
首先我們需要下載npm,安裝好了node.js,就安裝了npm。然后,再利用npm安裝淘寶鏡像的cnpm。
1、打開(kāi)cmd,輸入命令
npm install -g cnpm --registry=https://registry.npm.taobao.org
安裝Vue需要npm的版本大于3,所以我們先升級(jí)一下npm,輸入命令
cnpminstall cnpm -g
安裝vue,輸入命令
cnpminstall vue
安裝vue-cli,輸入命令
cnpm install--global vue-cli
這時(shí),環(huán)境已經(jīng)搭建好了。
2、指定存放項(xiàng)目的路徑,運(yùn)行命令
vue init webpack"項(xiàng)目名稱"
進(jìn)入項(xiàng)目所在的目錄,運(yùn)行命令
cd"項(xiàng)目所在文件夾“
然后依次執(zhí)行下面的命令
cnpm install
cnpm run dev
中間省略部分截圖。。。。
成功后我們進(jìn)入瀏覽器,輸入localhost:8080會(huì)展示下面的頁(yè)面。
項(xiàng)目目錄:
(1) build // 項(xiàng)目構(gòu)建(webpack)相關(guān)代碼
build.js // 生產(chǎn)環(huán)境構(gòu)建代碼
check-versions.js // 檢查node&npm等版本
dev-client.js // 熱加載相關(guān)
dev-server.js // 構(gòu)建本地服務(wù)器
utils.js // 構(gòu)建配置公用工具
vue-loader.conf.js // vue加載器
webpack.base.conf.js // webpack基礎(chǔ)環(huán)境配置
webpack.dev.conf.js // webpack開(kāi)發(fā)環(huán)境配置
webpack.prod.conf.js // webpack生產(chǎn)環(huán)境配置
(2)config// 項(xiàng)目開(kāi)發(fā)環(huán)境配置相關(guān)代碼
dev.env.js // 開(kāi)發(fā)環(huán)境變量
index.js //項(xiàng)目一些配置變量
prod.env.js // 生產(chǎn)環(huán)境變量
(3)node_modules// 項(xiàng)目依賴的模塊
(4)src// 源碼目錄
assets// 資源目錄 logo.png
components// vue公共組件 Hello.vue
router// 前端路由 index.js// 路由配置文件
App.vue// 頁(yè)面入口文件(根組件)
main.js// 程序入口文件(入口js文件)
(5)static// 靜態(tài)文件,比如一些圖片,json數(shù)據(jù)等
.gitkeep
(6)剩余
.babelrc// ES6語(yǔ)法編譯配置
.editorconfig// 定義代碼格式
.gitignore// git上傳需要忽略的文件格式
index.html// 入口頁(yè)面
package.json// 項(xiàng)目基本信息
README.md// 項(xiàng)目說(shuō)明
備注:這是我邊學(xué)習(xí)邊總結(jié),如果有錯(cuò)誤,歡迎大家指出,我會(huì)及時(shí)改正,謝謝!
總結(jié)
以上是生活随笔為你收集整理的vue之淘宝镜像安装的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: 百度网盟推广合作主题悬浮于今日正式上线
- 下一篇: 开源三年260家企业加入openGaus