vue的index.html引入js或css文件刷新后失效问题

最新推荐文章于 2022-06-11 19:35:39 发布
最新推荐文章于 2022-06-11 19:35:39 发布
阅读量8.1k 收藏 7
点赞数 9
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_28353055/article/details/88192170
版权

当vue的router模式设置为mode: 'history'时，全局引入 js 或者css在页面刷新后会失效
可参考官网https://router.vuejs.org/zh/guide/essentials/history-mode.html设置

另简单的两种方法

1.将mode: 'history'注释掉，变成 hash  模式，此时刷新不会有问题

2.在index.html引入的时候，将相对路径转换成绝对路径

相对路径：<script src="./powerbi.js"></script>

绝对路径：<script src="/powerbi.js"></script>

亲测，都可以用！！！

浊清。。。
关注
  • 9
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 8
    评论
专栏目录
vue引用外部JS的两种种方法
10-15
主要介绍了vue引用外部JS的两种种方案,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
vue的token刷新处理的方法
10-18
主要介绍了vue的token刷新处理的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
解决使用vue.js路由后失效的问题
11-29
新学了vue.js中的路由 在之前写的vue的demo上加上了简单的路由例子(来自vue-router 2),但是加上点击后只有地址栏变化,内容并不变.且之前用jquery写的一些效果也失效了.最后找到原因是因为同一个id被启动了两次(第一次是之前使用vue组件时启动的,另外一个是路由时启动的) 附上部分代码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!-- 引入样式 --> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-defau
vue.min.js 文件直接引入就可以
12-30
vue源文件vue.js
vue js引用路径报错解决方案
心若向阳，无谓悲伤的博客
04-01 4712
最近在做项目的时候，需要在index.html中引用js文件，但是一直报Failed to load resource: the server responded with a status of 404。 从字面上看，就是路径找不到，但是检查了一圈之后，发现路径没有错误啊。最后在浏览器调试台看到加载出来的文件的路径是这样的，在localhost:8080服务器下，先生成了本地磁盘路径，然后将s...
vue 进入子页面后 刷新页面 reset.css失效问题
记录博客好习惯
10-18 898
.在index.html引入的时候，将相对路径转换成绝对路径 相对路径：<link rel="stylesheet" type="text/css" href="./css/reset.css"> 绝对路径：<link rel="stylesheet" type="text/css" href="/css/reset.css"> 网上查询还有的说把 router...
vue index.html 引入外部 js
tang_jian_dong的博客
05-27 3290
有时候需要引入外部js, 或者需要全家依赖的js, 可以在index.html 中引入： 如下红色框： /是指的assetsPublicPath 指的 代表打包后，index.html里面引用资源的的相对地址。 参考博客：https://blog.csdn.net/weixin_33920401/article/details/87962115 ...
vue中index.html引入外部js，路由跳转失效解决方案
SourceYang_A的博客
07-17 2181
建议不要在index.html中引入js，参考解决方案可以在vue中引入外部js 声明：每人的思路不同，解决方案不同 这里是作者的解决方案 vue中引入js vue路由跳转js失效原因: 页面刷新，当时js不会重新加载。 ...
script资源加载失败，触发页面刷新
Loook_Mark的博客
06-11 999
前端页面升级，自动刷新，个人拙计
vue index.html引入js或者css无效时，其他方法引入（config.js）
前端小菜鸡的博客
04-16 2153
index.hmtl引入无效时 在config.js里面 遇到问题时，再补充
vue在index.html中引入静态文件不生效问题及解决方法
10-17
主要介绍了vue在index.html中引入静态文件不生效问题及解决方法，本文给大家分享两种原因分析，通过实例代码讲解的非常详细 ,需要的朋友可以参考下
vue.global.js，Vue.js 框架的核心文件之一
最新发布
08-11
`vue.global.js` 文件是 Vue.js 框架的核心文件之一。它包含了 Vue.js 全局对象的定义和一些全局方法和属性的实现。 该文件对整个 Vue.js 应用的运行起着重要的作用，它提供了全局范围的 Vue 构造函数和一些全局...
vue.js引入外部CSS样式和外部JS文件的方法
10-17
主要介绍了vue.js引入外部CSS样式和外部JS文件的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vue的跳转方式（打开新页面）
热门推荐
qq_28353055的博客
11-22 1万+
router-link跳转 // 直接写上跳转的地址 &amp;amp;amp;amp;lt;router-link to=&amp;amp;amp;quot;/detail/one&amp;amp;amp;quot;&amp;amp;amp;amp;gt; &amp;amp;amp;amp;lt;span class=&amp;amp;amp;quot;spanfour&amp;amp;amp;quot; &amp;am
iview表格颜色可动态配置
qq_28353055的博客
05-30 4005
由于新的功能需求，需要对表格颜色进行动态的配置，iview内部本身有对表格进行颜色设置，但是由于样式都需要提前写好，无法动态配置，所以自己在iview的基础上对dom树进行操作，但会一定程度上影响性能，这里仅展示对单元格颜色设置 1.首先看一下自带的表格,可以看官网：https://www.iviewui.com/components/table#ZDYLMB 从图中可以看到，单元格可以设置ce...
vue/iview的table单元格可编辑，可上下键切换，小键盘enter可选中下一个
qq_28353055的博客
03-15 3317
在开发过程中，前后至今遇到好几次的编辑输入框编辑情况，4.24之前的版本，虽然改进好几次操作，但是都是用render函数实现，发现有时并不是很好操作，而且隐藏好几个bug，今天（2019-7-19）发布一个新版，目前无发现bug，而且监听键盘更灵活。废话不多说，上代码 2019-04-24版本 因为需要多列可编辑表格，直接用render函数，isNum代表这个数是否需要只允许输入小数点 ...
vue动态路由变化页面不重新加载问题，实现方式比较简单，就是有点鸡贼
qq_28353055的博客
07-24 2933
由于使用了动态路由，有时候页面需根据路由来动态变化，整个页面需要重新加载，但是地址指向同一个，这边用了一个比较取巧的方式 将整个页面封装成一个子组件 children => formTe <template> <div> <formTe v-if='showNum/2 === 0' :key='showNum'></formTe>...
vue使用极验
qq_28353055的博客
11-23 2491
1.在vue中使用级验gt.js文件的时候，参考：https://blog.csdn.net/XiaoYi0215/article/details/79921967 在我这边个人使用过程中，缺少了这两句，一直出不来，放置在闭包最后，个人文件放置在libs下 window.initGeetest = initGeetest; return initGeetest; 2.当然，现在使用起来也是特...
vue index.html 引入js,vue引入js文件有哪几种方法
05-20
Vue 引入 JS 文件的方式有以下几种： 1. 在 index.html 中使用 script 标签引入外部 JS 文件： ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Vue App</title> </head> <body> <div id="app"></div> <script src="/path/to/vue.js"></script> <script src="/path/to/app.js"></script> </body> </html> ``` 2. 使用 Webpack 等构建工具打包 JS 文件，并在 Vue 组件中使用 import 引入： ```javascript import Vue from 'vue'; import App from './App.vue'; new Vue({ el: '#app', render: h => h(App) }); ``` 3. 在 Vue 组件中使用 require 引入外部 JS 文件： ```javascript export default { mounted() { require('/path/to/plugin.js'); // 或者 require(['/path/to/plugin1.js', '/path/to/plugin2.js'], function() { // 回调函数 }); } }; ``` 以上三种方式均可在 Vue 项目中引入外部 JS 文件。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 8
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值