关于vue项目在build部署出现的一些问题

最新推荐文章于 2025-03-07 18:36:49 发布

SHiny-Jun

最新推荐文章于 2025-03-07 18:36:49 发布

阅读量2.4k

点赞数

分类专栏： vue 文章标签： vue build

本文链接：https://blog.csdn.net/cuiji4724/article/details/81081027

版权

vue 专栏收录该内容

7 篇文章

订阅专栏

本文主要介绍了Vue项目在build部署过程中遇到的三个问题及解决方案：1) 文件路径修正，将config/index.js中的assetsPublicPath从'/'更改为'./'；2) 背景图片路径修复，在build/utils.js中添加publicPath: '../../'；3) 解决route下刷新404问题，通过将history路由模式改为hash路由模式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、文件路径不对

找到config文件夹下的index.js文件修改一下build中的

assetsPublicPath: '/',

改为assetsPublicPath: './',（在/前加.）

2、背景图片路径不对

在css中写的background-img的路径出错需要找到build文件夹下的utils.js,修改一下

  if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        fallback: 'vue-style-loader'
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }
  }

在这一段代码中添加：publicPath: '../../'，改后如下：

if (options.extract) {
      return ExtractTextPlugin.extract({
        use: loaders,
        fallback: 'vue-style-loader',
        publicPath: '../../'
      })
    } else {
      return ['vue-style-loader'].concat(loaders)
    }

3、在route下刷新页面后出现404

把一下的history改为hash，

export default new Router({
  mode: 'history',
  routes: [
    ...
  ],
  ...
})

改后如下：

export default new Router({
  mode: 'hash',
  routes: [
    ...
  ],
  ...
})