0.首先要配置Node.js環(huán)境

太多可參考的了，這里就不詳寫了。

1.1

菜鳥教程：https://www.runoob.com/nodejs/nodejs-npm.html

1.2

Node.js - npm 與cnpm配置(Windows10)：https://www.jianshu.com/p/2fda768e0448

1.3

npm和cnpm（windows）安裝步驟：https://blog.csdn.net/wjnf012/article/details/80422313

1.4

cnpm卸載命令：npm uninstall cnpm -g

安裝cnpm：npm install -g cnpm --registry=https://registry.npm.taobao.org

1.5

window下node進(jìn)入編輯模式后輸入require('express')后，提示Error: Cannot find module "***"的解決辦法：

環(huán)境變量NODE_PATH，其值設(shè)置為：

（安裝的node.js文件夾路徑）\node_global\node_modules

1.6

cnpm會(huì)被安裝到

（安裝的node.js文件夾路徑）\node_global\node_modules

下，而系統(tǒng)變量path并未包含該路徑。在系統(tǒng)變量path下添加路徑

（安裝的node.js文件夾路徑）\node_global

即可正常使用cnpm（如命令行輸入：cnpm -v驗(yàn)證）

1.7

npm執(zhí)行過程中，使用crtl+c將提示批處理操作是否終止（Y/N）

1.8

npm添加代理和取消代理（主要是淘寶鏡像）：https://www.cnblogs.com/tonyzt/p/11635421.html

1.新建項(xiàng)目

2.工具->內(nèi)置終端->插件安裝->安裝內(nèi)置終端

可能安裝完需要重啟hbuilderX??不重啟的話，這個(gè)內(nèi)置終端用起來會(huì)有點(diǎn)問題。

（不過，也可能只是個(gè)例現(xiàn)象？）(T?^?T)

3.選中項(xiàng)目 Alt+C 打開內(nèi)置終端

輸入以下內(nèi)容安裝依賴包：（這些以后大概率都會(huì)用上）淡━━(￣ー￣*|||━━定

npm install axios -save-dev? ? ? ? ? // 處理http應(yīng)用請求的包

npm install --save vue-router? ?// Vue官方的路由管理器

npm i element-ui -S // elementUI，一個(gè)不錯(cuò)的UI組件庫

npm install babel-plugin-component -D // 按需導(dǎo)入elementUI組件用

4.package.json 指南

http://nodejs.cn/learn/the-package-json-guide

（可以參考看看）∑（?〇О〇）真…真的嗎!?

5.工具->設(shè)置->運(yùn)行配置

1.node運(yùn)行配置

要配置的話：

（1）選擇內(nèi)置終端

（2）npm 路徑查詢?npm config get prefix（cmd 運(yùn)行）

（3）node 路徑查詢?where node?（cmd 運(yùn)行）

注：up主配置后會(huì)導(dǎo)致這里的npm run?serve不能用（尚不知啥原因）o(╥﹏╥)o

2.瀏覽器配置：（看個(gè)人用哪個(gè)了）

6. 選中項(xiàng)目->Alt+C?

現(xiàn)在要運(yùn)行項(xiàng)目爽一下了(?ω?)hiahiahia?，對，已經(jīng)可以用了，都是一些默認(rèn)的內(nèi)容

輸入：npm run serve

記得復(fù)制內(nèi)置終端里顯示的 ?http://localhost:8080/?到瀏覽器網(wǎng)址處打開，不然是不是覺得好像無事發(fā)生？_(??ω???」∠)_

7.main.js中：

Vue.config.productionTip = false

阻止啟動(dòng)生產(chǎn)消息，常用作指令

沒有Vue.config.productionTip = false這句代碼，它會(huì)顯示你生產(chǎn)模式的消息

開發(fā)環(huán)境下，Vue 會(huì)提供很多警告來幫你對付常見的錯(cuò)誤與陷阱。

而在生產(chǎn)環(huán)境下，這些警告語句卻沒有用，反而會(huì)增加應(yīng)用的體積。

此外，有些警告檢查還有一些小的運(yùn)行時(shí)開銷，這在生產(chǎn)環(huán)境模式下是可以避免的。

(摘于官網(wǎng)說明)

大概意思應(yīng)該就是，消息提示的環(huán)境配置，設(shè)置為開發(fā)環(huán)境或者生產(chǎn)環(huán)境

8.各種文件

favicon.ico一般用于作為縮略的網(wǎng)站標(biāo)志,它顯示位于瀏覽器的地址欄或者在標(biāo)簽上,用于顯示網(wǎng)站的logo, 如圖 紅圈 的位置， 目前主要的瀏覽器都支持favicon.ico圖標(biāo).?

main.js 入口js文件（里面將創(chuàng)建APP.vue根組件）

APP.vue 根組件

index.html 主頁

node_mudules npm下載的依賴

src 項(xiàng)目源碼目錄（基本都是在這里面寫代碼）

assets 靜態(tài)資源目錄

components 公共組件目錄

9.讓vue項(xiàng)目啟動(dòng)時(shí)自動(dòng)啟動(dòng)瀏覽器，注意得先配置好運(yùn)行配置里的瀏覽器路徑，然后

10.Vue路由

Vue路由（vue-router）詳細(xì)講解指南：

https://www.cnblogs.com/dengyao-blogs/p/11562257.html

11.vue初始化報(bào)錯(cuò)，Cannot read property '$createElement' of undefined

解決方法：router/index.js中 components改為component

12.注

我是菜鳥，有錯(cuò)請溫柔指出(?>?<?）