在build目錄下的webpack.prod.conf.js里面：

output: {

  path: config.build.assetsRoot,

  publicPath: "/dist/", // 添加這行代碼，可解決該問題或者publicPath: "./",也可解決

  filename: utils.assetsPath('js/[name].[chunkhash].js'),

  chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')

},

補(bǔ)充知識：vue項(xiàng)目打包后，npm run build相關(guān)配置，以及解決項(xiàng)目打包后，圖片404，背景圖片找不到，iview代碼出問題的情況

1.首先找到config下的index.js文件 將build下的assetsPublicPath的斜杠換成./ 操作如下

只需要換build中的就可以 dev中的assetsPublicPath不用動 不然打包過后 npm run dev的時(shí)候直接出現(xiàn)can not Get

2.因?yàn)榇虬笊傻氖莇ist文件夾 文件夾中是static文件夾和index.html static文件夾中包含css fonts img js等文件夾 我們寫好的css內(nèi)容在css文件夾中的app.css中 要訪問的圖片內(nèi)容在img下 所以要../../才可以訪問到

3.動態(tài)綁定src 應(yīng)使用require方式引入

4.使用iview，npm run build打包后，總會出現(xiàn)找不到woff字體等情況。在build文件夾下的webpack.prod.conf.js文件中 將extract改為false 就可以了

5.使用iview時(shí),有些樣式我們要自己修改成我們想要的 直接復(fù)制出來 新建個(gè)style標(biāo)簽在里面修改 在dev下訪問正常 npm run build下就出現(xiàn)問題 這個(gè)多數(shù)是嵌套問題

我當(dāng)時(shí)遇到的是左側(cè)菜單在開發(fā)時(shí)，一點(diǎn)問題都沒有。打包后左側(cè)菜單上面出來好大的空隙。本身調(diào)整好的懸停顏色還有字體背景等顏色都沒了 解決方法: 當(dāng)時(shí)項(xiàng)目用的是less 所以我在iview中找到我要重寫的這些css他們的層級嵌套關(guān)系,逐級嵌套 就解決了這個(gè)問題 如下圖 ivu-layout-sider是ivu-menu-submenu-title的父級 我當(dāng)時(shí)忽略他們的層級關(guān)系 沒有嵌套 直接平級的寫在less中了 開發(fā)時(shí)雖然沒出現(xiàn)問題 但是打包后問題百出 所以建議大家在開發(fā)時(shí) 要修改組件樣式的時(shí)候 也要對應(yīng)好層級關(guān)系

以上這篇解決vue項(xiàng)目,npm run build后,報(bào)路徑錯(cuò)的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。