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