這篇文章給大家分享的是有關(guān)怎么使用webpack打包后的vue項(xiàng)目正確運(yùn)行的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，一起跟隨小編過(guò)來(lái)看看吧。

嵐山ssl適用于網(wǎng)站、小程序/APP、API接口等需要進(jìn)行數(shù)據(jù)傳輸應(yīng)用場(chǎng)景，ssl證書未來(lái)市場(chǎng)廣闊！成為成都創(chuàng)新互聯(lián)公司的ssl證書銷售渠道，可以享受市場(chǎng)價(jià)格4-6折優(yōu)惠！如果有意向歡迎電話聯(lián)系或者加微信：13518219792（備注：SSL證書合作）期待與您的合作！

我們知道使用webpack打包vue項(xiàng)目后會(huì)生成一個(gè)dist文件夾，dist文件夾下有html文件和其他css、js以及圖片等，那么打包后的文件該如何正確運(yùn)行呢？

倘若直接打開html文件，會(huì)報(bào)如下錯(cuò)誤：

那么該如何運(yùn)行呢？其實(shí)可以將生成的dist文件部署到express服務(wù)器上運(yùn)行。

（1）、安裝express-generator生成器?！　?/p>

npm install express-generator -g // 也可使用cnpm比較快　

（2）、創(chuàng)建一個(gè)express項(xiàng)目。

express expressName // expressName是項(xiàng)目名

（3）、進(jìn)入項(xiàng)目目錄，安裝相關(guān)項(xiàng)目依賴。

　cd expressName
　　　　npm install // 或cnpm install

（4）、此時(shí)生成的項(xiàng)目目錄應(yīng)該是這樣的：

（5）、將dist文件夾下的所有文件復(fù)制到express項(xiàng)目的publick文件夾下面，然后運(yùn)行npm start來(lái)啟動(dòng)express項(xiàng)目。

（6）、打開瀏覽器，輸入localhost:3000就可以看到效果了。例如我的是這樣的：　

感謝各位的閱讀！關(guān)于“怎么使用webpack打包后的vue項(xiàng)目正確運(yùn)行”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)，如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！