1.安裝寶塔界面；

2.在寶塔界面“軟件管理”或“軟件商店”安裝PM2；

3.檢查是否安裝成功和版本號(hào)，用SSH登陸服務(wù)器；輸入：

a、node -v 命令：查看node的版本，若出現(xiàn)相應(yīng)的版本號(hào)，則說(shuō)明你安裝成功了。
b、npm -v 命令：npm包管理器，是集成在node中的，所以安裝了node也就有了npm,直接輸入 npm -v 命令，顯示npm的版本信息。

4.安裝cnpm

在命令行中輸入??npm install -g cnpm --registry=http://registry.npm.taobao.org ?，然后等待，沒(méi)報(bào)錯(cuò)表示安裝成功。

5.安裝webpack

在命令行中輸入? cnpm install -g webpack

6.安裝vue的腳手架工具

在命令行中輸入? cnpm install -g vue-cli

輸入：vue，回車，若出現(xiàn)vue信息說(shuō)明表示成功。

7.創(chuàng)建項(xiàng)目（可以直接進(jìn)入寶塔默認(rèn)網(wǎng)站目錄?cd /www/wwwroot/?執(zhí)行。?）

在命令行中輸入：vue init webpack vue_test(項(xiàng)目文件夾名)，回車，等待一小會(huì)兒，依次出現(xiàn)‘git’下的項(xiàng)。

注意事項(xiàng)：此時(shí)會(huì)不斷要你輸入些東西，注意到Eslint那個(gè)選項(xiàng)是選擇
N（Eslint是語(yǔ)法規(guī)則和代碼風(fēng)格的檢查工具，會(huì)自動(dòng)檢測(cè)當(dāng)前項(xiàng)目的代碼是否符合預(yù)設(shè)的規(guī)則，如果你的代碼寫(xiě)得不符合預(yù)設(shè)的規(guī)則會(huì)報(bào)錯(cuò)），然后一直回車。

8.安裝項(xiàng)目所需依賴，進(jìn)入項(xiàng)目中：

cd vue_test

cnpm install

完成后，會(huì)發(fā)現(xiàn)項(xiàng)目目錄下多出一個(gè)node_modules文件夾，里面就是 vue-cli 創(chuàng)建的一個(gè)基于 webpack 的 vue.js 項(xiàng)目。

9.上傳項(xiàng)目文件到項(xiàng)目目錄里。并修改config/index.js? 訪問(wèn)的IP和端口號(hào)。

host: '127.0.0.1', // can be overwritten by process.env.HOST
port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
notifyOnErrors: true,

10.運(yùn)行項(xiàng)目

在命令行中輸入? npm run dev

當(dāng)顯示：Your application is running here: http://127.0.0.1:8081? ?代表項(xiàng)目運(yùn)行成功！

?

使用vue-cli初始化項(xiàng)目時(shí)運(yùn)行‘npm run dev’報(bào)錯(cuò)

1、試一下 卸載npm uninstall webpack-dev-server，在安裝這個(gè)npm i webpack-dev-server@2.9.7，我的可以正常啟動(dòng)了。?
2、刪除node_modules目錄，使用npm install，不要用cnpm，npm也是可以設(shè)置成淘寶鏡像的，cnpm有時(shí)候用起來(lái)會(huì)有很多問(wèn)題，無(wú)名無(wú)故的安裝些多余的東西。

?

總結(jié)

以上是生活随笔為你收集整理的宝塔环境下配置PM2+NODE+VUE+WEBPACK环境的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。