TP6高并發(fā)電商-vue開發(fā)環(huán)境部署說明

vue開發(fā)環(huán)境部署，以及構(gòu)建運行項目說明：windows安裝步驟：一.安裝node.js說明：安裝node.js的windows版本后，會自動安裝好node以及包管理工具npm，我們后續(xù)的安裝將依賴npm工具。node.js的官方地址為：/en/download/，如下圖所示：根據(jù)自己電腦的具體配置，選擇你要下載的安裝包。二.設(shè)置global和cache路徑說明：設(shè)置路徑能夠把通過npm安裝的模塊集中在一起，便于管理。1. 在nodejs的安裝目錄下，新建node_global和node_cache兩個文件夾，作者的安裝目錄為“D:Program Filesnodejs”2. 設(shè)置global和cache3. npm config set prefix D:Program Filesnodejsnode_global4. npm config set cache D:Program Filesnodejsnode_cache3. 設(shè)置成功后，后續(xù)用命令npm install XXX -g安裝以后模塊就在D:Program Filesnodejsnode_globalnode_modules里三、安裝cnpm說明：由于許多npm包都是在國外，我們這里用到淘寶的鏡像服務(wù)器，來對我們依賴的module進行安裝，因此首先安裝“中國的npm”cnpm參考網(wǎng)址如下：/安裝命令為：npm install -g cnpm -registry=四、設(shè)置環(huán)境變量（非常重要）說明：設(shè)置環(huán)境變量可以使得住任意目錄下都可以使用cnpm、vue等命令，而不需要輸入全路徑1.鼠標(biāo)右鍵此電腦，選擇“屬性”菜單，在彈出的“系統(tǒng)”對話框中左側(cè)選擇“高級系統(tǒng)設(shè)置”，彈出“系統(tǒng)屬性”對話框。2.點擊環(huán)境變量彈出下列對話框：3. 修改用戶變量PATH：選中PATH，點擊編輯，在已有的變量后面，加入英文的;，然后把“D:Program Filesnodejsnode_global”加到后面4.新增系統(tǒng)變量NODE_PATH：在下面的系統(tǒng)變量中點擊新建，彈出下框，把變量值設(shè)置成“D:Program Filesnodejsnode_globalnode_modules”五、用cnpm安裝vuecnpm install vue -g六、安裝vue命令行工具cnpm install -g vue/cli七、 創(chuàng)建工程1. 用cd命令來到你將要新建工程的目錄，執(zhí)行vue create mytest2.定位到mytest的工程目錄下cd mytest4.安裝該工程依賴的模塊，這些模塊將被安裝在：mytestnode_module目錄下，node_module文件夾會被新建，而且根據(jù)package.json的配置下載該項目的modulescnpm install5.運行該項目，測試一下該項目是否能夠正常工作，這種方式是用nodejs來啟動。npm run serve八、 部署1.build前的配置，防止js、css文件路徑錯誤，在build目錄下面找到d.conf.js文件，找到output節(jié)點，添加 publicPath:./ 2. 執(zhí)行命令npm run buildbuild 項目3. 在根目錄下會生成dist目錄，里面的內(nèi)容就是構(gòu)建的結(jié)果4. 將構(gòu)建結(jié)果dist目錄下面的內(nèi)容放在nginx的發(fā)布目錄下即可訪問-MAC安裝步驟：一、安裝brew打開終端運行以下命令：（復(fù)制下面的代碼在終端，再回車）/usr/bin/ruby -e $(curl -fsSL/Homebrew/install/master/install)安裝成功后，查看一下brew的版本信息：(如果有提示版本號說明安裝成功)brew -v二、安裝node.js在終端直接運行下面指令，然后等待安裝brew install nodejs安裝完成后輸入下面指令檢測看看是否安裝成功：（有檢測到版本號說明成功，直接下一步）node -v獲取nodejs模塊安裝目錄訪問權(quán)限sudo chmod -R 777 /usr/local/lib/node_modules/三.安裝cnpm (淘寶鏡像)npm install -g cnpm -registry=四、安裝webpacknpm install webpack -g五、安裝vue-clicnpm install -g vue/cli 到這里就搭建好了vue開發(fā)環(huán)境六、創(chuàng)建一個vue工程先指定一個目錄來存放你要創(chuàng)建到工程，然后cd到該目錄vue create mytest然后cd進入到你剛建到工程目錄里安裝項目依賴:cnpm install七、啟動項目 npm run serve 然后就可以在瀏覽器打開輸入http:/localhost:8080打開該項目八、部署項目跟上述windows一樣操作-克隆遠程項目，本地運行步驟：一、 使用git clone命令把