HTML引入vue.js,在ie浏览器中不显示
程序员文章站
2022-05-25 20:53:40
...
因为只有两个页面,所以我没有用 vue-cli 搭框架,直接在 HTML 中引入vue.js 文件。发现其他浏览器都能正常显示,ie 下显示不正常,而且还报错,错误信息如下:
原因: 主要是因为 ie 不支持 ES6 的语法。
在 vue-cli 中,ie 浏览器下不显示,需要下载安装 babel-polyfill(npm i babel-polyfill
),同样的,在 html 中使用 vue 的语法时,也需要引入 babel 和 polyfill。这里参考了天天饱的博客。
具体步骤:
1. 下载文件到本地,并且放到自己的 js 文件中;
(1)browser.min.js 源码 : https://blog-static.cnblogs.com/files/gxsyj/browser.min.js
(2)polyfill.min.js 源码:https://blog-static.cnblogs.com/files/gxsyj/polyfill.min.js
2. 在引入 vue.js 之前就引入这两个文件。
<script src="../js/browser.min.js"></script>
<script src="../js/polyfill.min.js"></script>
3. 在 script 标签中 添加 type="text/babel"
。
需要注意的是,这里需要添加属性的 js 文件都是自己写的。比如我在这里封装了axios的请求和自定义的一些方法(其他的就不需要添加,例如:vue.js。通常都是在网页上下载下来的 js 文件):
<script src="../js/api.js" type="text/babel"></script>
<script type="text/babel">
new Vue({
el: '#app',
data: function() {
return {
visible: false,
tableData: []
}
},
methods:{
}
})
</script>
推荐阅读
-
『vue踩坑日常』 在index.html中引入静态文件不生效
-
在IE浏览器状态栏中显示“网页上有错误错误”的几个原因和解决办法
-
解决ExtJS在chrome或火狐中正常显示在ie中不显示的浏览器兼容问题
-
html页面 在ie 浏览器下页面显示变形_html/css_WEB-ITnose
-
Div在浏览器中居中显示_html/css_WEB-ITnose
-
问问高人为什么这个网页FLASH音乐播放在IE里有显示,在CHROME等别的浏览器没显示啊_html/css_WEB-ITnose
-
Div在浏览器中居中显示_html/css_WEB-ITnose
-
在IE中显示正常,在火狐和谷歌浏览器中显示太坑爹了...各路高人求求进来指点.._html/css_WEB-ITnose
-
FLASH在IE浏览器显示正常,在别的浏览器一片空白,为什么呢_html/css_WEB-ITnose
-
验证码在IE中不刷新而谷歌等浏览器正常的解决方案_javascript技巧