1. 安裝node.js
2. cd到項目目錄下
3. npm run serve
Node.js下載下傳與安裝(npm)
Node.js 是一個基于 Chrome V8 引擎的 JavaScript 運作環境。 JavaScript本來隻能跑在浏覽器上,然後Node.js就
是一種能讓js直接運作在作業系統的工具。并且它就能夠讓JS代碼在作業系統上實作一些類似檔案操作等功能。
Node.js 使用了一個事件驅動、非阻塞式 I/O 的模型,使其輕量又高效。
npm 是JavaScript 世界的包管理工具,并且是 Node.js 平台的預設包管理工具。
(類似Python中的pip一樣。)
由于新版的nodejs已經內建了npm,是以之前npm也一并安裝好了。同樣可以通過輸入 npm -v 來測試是否成功
安裝。指令如下,出現版本提示表示安裝成功:
更新npm至最新的穩定版本
npm install npm@latest -g
npm常用指令:
https://segmentfault.com/a/1190000012099112
使用cnpm
因為npm安裝插件是從國外伺服器下載下傳,受網絡影響大,安裝依賴包的時候經常會出現逾時的問題。我們可以使
用cnpm 代替npm。
cnpm是淘寶團隊維護的一個完整 npmjs.org 鏡像,用來代替官方版本(隻讀),同步頻率目前為 10分鐘 一次以保證
盡量與官方服務同步。
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm跟npm用法完全一緻,隻是在執行指令時将npm改為cnpm。
例如: cnpm install [email protected]
webpack介紹
webpack 就是一個把我們在後端寫的JS代碼打包成浏覽器認識的JS檔案(當然webpack 很強大它可以打包JS、
CSS、圖檔等靜态資源)。 我們并不關心打包後的JS檔案裡面的内容都是什麼,隻要它體積小、浏覽器能認識就可
以了。
webpack安裝
我們這裡安裝的是 webpack v4+ 版本,還需要安裝CLI工具配合。我們這裡安裝的是webpack-cli 。執行下面的
指令同時安裝webpack 和webpack-cli 。
npm install webpack webpack-cli -g -D
啟動一個Vue3.x項目
Vue-CLI安裝: Vue CLI 需要 Node.js 8.9 或更高版本 (推薦 8.11.0+)
vue-cli 是一個Vue官方提供的快速建構Vue項目的腳手架工具,能夠極大的提高開發效率。
全局安裝最新版本vue-cli
npm install -g @vue/cli
安裝完畢後檢查vue-cli版本:
vue --version
Vue-CLI使用
vue create 項目名稱
接下來具體建立過程見下方GIF動圖:
使用浏覽器打開http://localhost:8080/ ,就能看到Vue項目已經搭建好了。
除了上面指令行方式建立Vue項目外,還可以使用vue ui 指令以圖形化界面建立和管理項目。
vue ui
補充常用指令(需進入項目目錄下執行):
1. 安裝項目依賴/配置項目(拿到一個Vue項目之後先運作這個安裝包依賴)
npm install
2. 編譯并在本地啟動一個開發環境
npm run serve
3. 編譯并打包一個生産版本
npm run build
4. 運作測試(前提你要寫好測試腳本)
npm run test
5. 運作代碼檢測
npm run lint