學(xué)習(xí)前端的小伙伴越來越多，問題也就越多，前面基礎(chǔ)部分還好一些，特別是一到框架的時(shí)候，難住了一大部分人，今天小猿圈web前端講師就為大家總結(jié)了vue-cli項(xiàng)目打包完成后運(yùn)行文件路徑報(bào)錯(cuò)問題，有興趣的小伙伴可以看一下。

剛新建的vue-cli項(xiàng)目，同事說要打包一版進(jìn)行測(cè)試，打包完成后放在tomcat上發(fā)現(xiàn)路徑報(bào)錯(cuò)問題。

百度了一下，懷疑是build里面沒有定義路徑問題，度友提供了解決方案：

找到config文件夾下的index.js文件，修改路徑代碼

找到build對(duì)象，修改屬性assetsPublicPath為‘./'

但是由于vue-cli項(xiàng)目中已經(jīng)沒有config文件夾，需要在根目錄下創(chuàng)建vue.config.js

具體配置網(wǎng)上查了一下，用了一個(gè)推薦的配置：

module.exports = {

baseUrl: '/',

outputDir: 'dist',

lintOnSave: true,

runtimeCompiler: true, //關(guān)鍵點(diǎn)在這

// 調(diào)整內(nèi)部的 webpack 配置。

// 查閱 https://github.com/vuejs/vue-doc-zh-cn/vue-cli/webpack.md

chainWebpack: () => {},

configureWebpack: () => {},

// 配置 webpack-dev-server 行為。

devServer: {

open: process.platform === 'darwin',

host: '0.0.0.0',

port: 8080,

https: false,

hotOnly: false,

// 查閱 https://github.com/vuejs/vue-doc-zh-cn/vue-cli/cli-service.md#配置代理

proxy: null, // string | Object

before: app => {}

}

}

但是這個(gè)配置打包完之后依舊報(bào)錯(cuò)，看了原因，是baseUrl:'/'的路徑還是有問題，把路徑改為baseUrl:'./'就能找到對(duì)應(yīng)的路徑了，以下為修改后代碼：

module.exports = {

baseUrl: './',

outputDir: 'dist',

lintOnSave: true,

runtimeCompiler: true, //關(guān)鍵點(diǎn)在這

// 調(diào)整內(nèi)部的 webpack 配置。

// 查閱 https://github.com/vuejs/vue-doc-zh-cn/vue-cli/webpack.md

chainWebpack: () => {},

configureWebpack: () => {},

// 配置 webpack-dev-server 行為。

devServer: {

open: process.platform === 'darwin',

host: '0.0.0.0',

port: 8080,

https: false,

hotOnly: false,

// 查閱 https://github.com/vuejs/vue-doc-zh-cn/vue-cli/cli-service.md#配置代理

proxy: null, // string | Object

before: app => {}

}

}

以上就是小猿圈web前端講師對(duì)于vue-cli項(xiàng)目打包完成后運(yùn)行文件路徑報(bào)錯(cuò)問題的介紹，希望無論是初學(xué)還是專業(yè)前端，都能找到適合自己操作的框架，學(xué)習(xí)前端如果有不懂得地方可以到小猿圈網(wǎng)站尋找答案，里面有專業(yè)的講師團(tuán)隊(duì)還有優(yōu)秀的助教老師，等你來學(xué)習(xí)。

《新程序員》：云原生和全面數(shù)字化實(shí)踐50位技術(shù)專家共同創(chuàng)作，文字、視頻、音頻交互閱讀

總結(jié)

以上是生活随笔為你收集整理的th:text为null报错_小猿圈web前端之vue-cli项目打包完成后运行文件路径报错问题的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。