vue 没有build这个目录_vue-cli项目上传Github预览

本文记录了使用Vue CLI创建的项目上传至GitHub并利用GitHub Pages预览时遇到的文件路径问题及解决方案。主要涉及修改`config/index.js`的assetsPublicPath、`build/utils.js`的背景图片路径以及`webpack.prod.conf.js`的HTML引入文件引号问题。完成这些修改后,通过`npm run build`打包项目,可以选择上传dist目录或者整个项目到GitHub以预览。
摘要由CSDN通过智能技术生成

最近在用Vue仿写cnode社区,想要上传到github,并通过Github pages预览,在这个过程中遇到了一些问题,因此写个笔记,以便查阅。
完成Vue项目以后,在上传到github之前,需要修改一些配置才能通过github pages预览项目。
1. 解决文件路径问题:
打开项目根目录config文件夹下的index.js文件,进行如下修改:

e30017d60ea5de0f4eed8175f5969f1c.png

看清楚是 build(上边还有个dev 是开发环境下的配置,不需要改动)下的 assetsPublicPath :将‘/'改为‘./'

2. 背景图片路径错误
在css中写的background-img的路径出错需要找到build文件夹下的utils.js,修改一下位置
打开根目录build文件夹中的utils.js文件,在下图中标出的位置中添加publicPath: '../../', 

57bc7b15376434c6d9cdf5c01fa8c80c.png


3.项目打包后dist文件夹下的index.html引入文件没有

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值