如果静态文件不是部署在网站根目录下，vue-cli将给你造成巨大的麻烦。

你不能直接把build好的文件抛进一个目录。
你不能直接在本地打开用vue做好的静态网站。

改成相对路径，主要需要做两步。

1、修改config => index.js => build => assetsPublicPath 中的'/'成为'./'

2、在build => util.js 里找到ExtractTextPlugin.extract

增加一行：publicPath: '../../'

之后，你使用npm run build打包出来的文件，就可以直接打开运行啦！也可以直接作为HTML静态页面仍进服务器

转载自：https://blog.csdn.net/jonesunq/article/details/79581025

vue相对路径修改的更多相关文章

  1. vue element Admin - 修改浏览器标签名 + 添加tagView标签 +固定导航头部 + 添加侧边栏Logo

    1 .修改浏览器标签名称: 修改浏览器标签名称在文件:\src\settings.js   image.png 2 .修改固定头部Header和侧边栏 Logo:   image.png 1)侧边栏文 ...

  2. maven之respository(仓库)本地路径修改

    maven默认的仓库路径会在c盘(我的C:\Users\Administrator\.m2\repository),这样如果系统出问题或其他原因会造成仓库损坏,因此会自己配置仓库路径. 1.首先找到你 ...

  3. xp默认安装路径及本地用户配置文件存放路径修改

    xp默认安装路径及本地用户配置文件存放路径修改 修改注册表可能会造成您的系统崩溃或数据丢失,请先行备份操作系统,以备不测!!! 备份注册表步骤: 1.在“桌面”上按快捷键“Ctrl+R”,调出“运行” ...

  4. AMH4.2 Ftp账号路径修改设置

    AMH4.2的ftp控制有点不尽如人意,每个ftp账号只能对应一个站点:如果按照面板所提供的权限,有多少个站就得设置多少个ftp账号,这一操作就会非常麻烦,造成效率低下:不过AMH5.0已经能够通过面 ...

  5. [Eclispe] NDK内建include路径修改

    [Eclispe] NDK内建include路径修改 编辑 jni/android.mk 中 LOCAL_C_INCLUDES 变量后,该变量值将被列入项目属性的内建include头文件包含路径,无法 ...

  6. Oculus Store游戏下载默认路径修改方法

    最近在测试一款VR游戏,所以在硬件设备上选择了HTC Vive和Oculus两款眼镜.相对而言,HTC安装比较人性化:支持自定义安装路径,而且可在界面更改应用程序下载位置,如图所示: 这下替我节省了不 ...

  7. vue中直接修改props中的值并未给出警告，为啥？

    问:vue中直接修改props中的值并未给出警告,为啥? 答:如果props传入的值是引用类型,在子组件中改变其元素,不改变引用,那么不报错: 如果是基本类型,那么在修改时浏览器控制台会有报错信息. ...

  8. ubuntu16.04 Docker默认存储路径修改

    Ubuntu 16.04 Docker默认存储路径修改

  9. Android Studio配置文件路径修改

    用Android Studio进行Android开发已经成为趋势了,好的工具要用得称手也少不了好的调教,在Windows下更是如此.这里对Android Studio的相关配置文件的路径修改做下小结. ...

随机推荐

  1. linux ln 建立软链接-- 基于dubbo-zookeeper服务的 服务jar 引用公共的 lib

    对于ln命令网上有很多的教程,这里不再复述, 其基本目的是:多个文件夹公用一个文件夹的里的文件. 其基本命令格式: ln [option] source_file dist_file (source_ ...

  2. LeetCode：16. 3Sum Closest（Medium）

    1. 原题链接 https://leetcode.com/problems/3sum-closest/description/ 2. 题目要求 数组S = nums[n]包含n个整数,找出S中三个整数 ...

  3. 深入理解计算机系统（1）--hello world程序的生命周期

    第一篇笔记的主题是讨论Hello World程序的生命周期,程序是最简单的hello world程序,使用高级C语言编写. 先介绍整个生命周期中涉及到的几个部分以及相应的概念,然后总结整个生命周期,最 ...

  4. 存一些有用的CSS

    reset ;} table{} fieldset,img{} address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;fon ...

  5. 第二十三篇 logging模块(******)

    日志非常重要,而且非常常用,可以通过logging模块实现. 热身运动 import logging logging.debug("debug message") logging. ...

  6. shiro笔记

    控制某一角色拥有此选项 上图 标签为shiro:hasRole表示 此时只有admin角色才拥有 系统用户管理和角色管理两个tab 页 上图 标签为shiro:hasPermission表示 此时只有 ...

  7. Struts2(六.用标签显示用户列表及Value Stack和Stack Context)

    一.用Struts2标签显示用户列表 原理: 在struts中可以通过在action中将所有用户的信息存入到某个范围中,然后转向userlist.jsp,进行访问 原则: 在jsp网页上,尽量不要出现 ...

  8. python学习总结----简单数据结构

    mini-web服务器 - 能够完成简单的请求处理 - 使用http协议 - 目的:加深对网络编程的认识.为后面阶段学习web做铺垫 简单数据结构 - 排列组合 import itertools # ...

  9. 修复 Ubuntu 中“Unable to lock the administration directory (/var/lib/dpkg/)”

    在 Ubuntu 或者它的衍生版如 Linux Mint(我已经作为日常工作使用的系统)中使用 apt-get 命令或者其相对更新的APT 管理工具时,你可能会在命令行中看到一个 unable to ...

  10. wangEditor编辑器中解析html图文信息问题

    在JS中,有一种方法:innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML. 也就是说,我们可以利用这个属性,把字符串转换为html代码,这样就可以被解析了. 其次,我们是需要在页 ...