Node.js+Vue腳手架環(huán)境搭建的方法步驟

更新時間：2020年03月08日 16:26:39 作者：dqli

這篇文章主要介紹了Node.js+Vue腳手架環(huán)境搭建的方法步驟，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧

Node.js的下載

node下載地址：https://nodejs.org/zh-cn/download/

下載后安裝即可。新版Node.js自帶npm包管理器

# 查看node的版本
node -v
# v12.16.1
# 查看npm版本
npm -v
#6.13.4

第一個Node.js程序,新建helloworld.js文件，內容如下

console.log（"Hello World"）
console.log（"第一個Node.js程序!"）

進入終端 node helloworld.js

注意：
node安裝路徑默認為/usr/local/bin/node
npm路徑為/usr/local/bin/npm

搭建Vue CLI腳手架

Vue CLI是一個基于Vue.js進行快速開發(fā)的完整系統(tǒng)
Vue CLI 的包名稱由 vue-cli 改成了 @vue/cli。如果你已經(jīng)全局安裝了舊版本的 vue-cli (1.x 或 2.x)，你需要先通過 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸載它。
Vue CLI 需要 Node.js 8.9 或更高版本 (推薦 8.11.0+)

設置淘寶鏡像

npm config set registry https://registry.npm.taobao.org

# 查看是否設置成功
npm get registry

安裝

# -g表示全局安裝
sudo npm install -g @vue/cli
# 或則
sudo yarn global add @vue/cli

安裝好后就可以在終端終端中訪問vue命令

vue -V

安裝全局插件,詳情見官網(wǎng)

sudo npm install -g @vue/cli-service-global

# 安裝成功提示
+ @vue/cli-service-global@4.2.3
added 1216 packages from 866 contributors in 83.013s

創(chuàng)建第一個應用程序

# 通過圖形化界面方式創(chuàng)建項目（新手推薦）
vue ui

下一步->預設(選擇默認) -> 下一步

在瀏覽器中輸入地址

可能遇到的坑

1.輸入npm install -g @vue/cli后，停留在此界面

解決:

設置淘寶鏡像: npm config set registry https://registry.npm.taobao.org

2.提示權限不足!

再npm命令前加sudo如 sudo npm install -g @vue/cli

到此這篇關于Node.js+Vue腳手架環(huán)境搭建的方法步驟的文章就介紹到這了,更多相關Node.js Vue腳手架搭建內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

element中table操作按鈕展示與折疊的實現(xiàn)示例
因為隨著功能的增多，table操作欄中的功能按鈕增多，這時候就需要折疊，本文主要介紹了element中table操作按鈕展示與折疊的實現(xiàn)示例，具有一定的參考價值，感興趣的可以了解一下
2022-04-04
vue3?圖片懶加載的兩種方式、IntersectionObserver和useIntersectionObserve
這篇文章主要介紹了vue3?圖片懶加載的兩種方式、IntersectionObserver和useIntersectionObserver實例詳解,本文通過實例代碼給大家介紹的非常詳細，需要的朋友可以參考下
2023-03-03
vue+webpack模擬后臺數(shù)據(jù)的示例代碼
這篇文章主要介紹了vue+webpack模擬后臺數(shù)據(jù)的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2018-07-07
vue-nuxt?登錄鑒權的實現(xiàn)
本文主要介紹了vue-nuxt?登錄鑒權的實現(xiàn)，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2021-12-12
Vue自定義指令獲取不到參數(shù)的原因及解決
這篇文章主要介紹了Vue自定義指令獲取不到參數(shù)的原因及解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2022-08-08
vue服務端渲染緩存應用詳解
vue緩存分為頁面緩存、組建緩存、接口緩存，這里我主要說到了頁面緩存和組建緩存。接下來通過本文給大家介紹vue服務端渲染緩存應用 ,需要的朋友可以參考下
2018-09-09
解決vue動態(tài)下拉菜單有數(shù)據(jù)未反應的問題
這篇文章主要介紹了解決vue動態(tài)下拉菜單有數(shù)據(jù)未反應的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2020-08-08
vue仿ios列表左劃刪除
這篇文章主要為大家詳細介紹了vue仿ios列表左劃刪除，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2019-09-09
vue3數(shù)組或對象賦值不更新解決方法示例
這篇文章主要為大家介紹了vue3數(shù)組或對象賦值不更新解決方法示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
2023-11-11
vue項目實現(xiàn)面包屑導航
這篇文章主要為大家詳細介紹了vue項目實現(xiàn)面包屑導航，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-04-04