vue使用npm run build命令打包

vue使用npm run build命令打包項目

 

當咱們使用vue-cli腳手架完成一個項目的時候，下一步確定會想要怎麼把這個項目放到互聯網上或者本地直接打開呢，咱們在本地調試的時候只要命令行執行npm run dev就能夠把這個項目跑起來，可是如今咱們要把他放到服務器上的話用npm run build命令就能夠啦。

首先

命令行執行npm run build命令，命令須要在項目目錄下執行

C:\Users\John\Desktop\demo>npm run build   個人是一個在桌面叫demo的項目

出現如下提示表示打包完成：

而後

咱們就能夠像打開靜態網頁同樣打開咱們完成的項目。

下圖爲打包生成的dist文件夾，其中index.html爲入口文件：

沒錯，這時你打開了index.html文件，發現網頁一片空白，打開F12發現console報了幾個錯誤，狀態碼爲404：

這是由於引用資源的路徑問題，咱們只要在下圖的地方修改一下再打包就能夠了。

須要修改的文件在項目目錄下的config文件夾裏的index.js文件中

改完，再次執行npm run build，而後打開index.html發現sucess

demo

完。