Shulou(Shulou.com)05/31 Report--

This article is a detailed introduction to "how to solve the error of running file path after vue-cli project packaging". The content is detailed, the steps are clear, and the details are properly handled. I hope this article "how to solve the error of running file path after vue-cli project packaging is completed" can help you solve your doubts. The following is a detailed introduction to learn new knowledge together.

Question:

The newly created vue-cli project, colleagues said to package a version for testing, after packaging, put it on tomcat and found the path error problem.

Baidu a bit, suspected that there is no defined path problem in build, degree friends provided a solution:

Find the index.js file under config folder and modify the path code

Find the build object and modify the assetsPublicPath property to './ '

However, since there is no config folder in the vue-cli project, you need to create vue.config.js in the root directory

I checked the specific configuration online and used a recommended configuration:

module.exports = { baseUrl:'/', outputDir:'dist', lintOnSave: true, runtimeCompiler: true, //key points here//adjust internal webpack configuration. //See https://github.com/vuejs/vue-doc-zh-cn/vue-cli/webpack.md chainWebpack: () => {}, configureWebpack: () => {}, //Configure webpack-dev-server behavior. devServer: { open: proxy.platform === 'darwin', host: ' 0.0.0', port: 8080, https: false, hotOnly: false, //View https://github.com/vuejs/vue-doc-zh-cn/vue-cli/cli-service.md#Configuration Proxy String: null, //| Object before: app => {} }}

But this configuration still reports an error after packaging. After looking at the reason, there is still a problem with the path of baseUrl: '/'. Change the path to baseUrl: './ 'You can find the corresponding path, the following is the modified code:

module.exports = { baseUrl: './ ', outputDir: ' dist', lintOnSave: true, runtimeCompiler: true, //key points here//adjust internal webpack configuration. //See https://github.com/vuejs/vue-doc-zh-cn/vue-cli/webpack.md chainWebpack: () => {}, configureWebpack: () => {}, //Configure webpack-dev-server behavior. devServer: { open: proxy.platform === 'darwin', host: ' 0.0.0', port: 8080, https: false, hotOnly: false, //View https://github.com/vuejs/vue-doc-zh-cn/vue-cli/cli-service.md#Configuration Proxy String: null, //| Object before: app => {} }}

Results:

Read here, this article "vue-cli project packaging after the completion of the run file path error how to solve" article has been introduced, want to master the knowledge points of this article also need to practice to understand, if you want to know more about the content of the article, welcome to pay attention to the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.