您好,登錄后才能下訂單哦!
這篇文章主要介紹了打包vue.js項目的操作步驟,具有一定借鑒價值,需要的朋友可以參考下。下面就和我一起來看看吧。
打包vue.js項目的方法:首先打開“webpack.dev.conf.js”文件;然后修改build下的assetsPublicPath;最后終端運行“npm run build”命令即可。
本教程操作環境:windows7系統、webstorm2017.1.4&&vue2.0版本、Dell G3電腦。
vue項目打包步驟
vue項目打包
一、終端運行命令 npm run build
二、打包成功的標志與項目的改變,如下圖:
3、點擊index.html,通過瀏覽器運行,出現以下報錯,如圖:
四、那么應該如何修改呢?
具體步驟如下:
1、查看package.js文件的scripts命令
2、打開webpack.dev.conf.js文件,找到publicPath: config.dev.assetsPublicPath,按Ctrl點擊,跳轉到index.js文件
3、其中dev是開發環境,build是構建版本,找到build下面的assetsPublicPath: '/',然后修改為assetsPublicPath: './',即“/”前加點。
4、終端運行 npm run build 即可。
此時點擊index.html,通過瀏覽器運行便,會發現動態綁定的static的圖片找不到,故static必須使用絕對路徑。將圖片路徑修改為絕對路徑,至此,打包完成。
以上就是打包vue.js項目的操作步驟的詳細內容了,看完之后是否有所收獲呢?如果想了解更多相關內容,歡迎來億速云行業資訊!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。