开发者社区> cacao111> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

解决vue在ie9中的兼容问题

简介:
+关注继续查看

vue 解决ie9的兼容问题

当vue遇见ie9的时候,部署到服务器之后,打开居然是一片空白,vue是支持ie9的,这个时候就需要来一波兼容了

参考尤大的解答  https://github.com/vuejs-templates/webpack/issues/260

  • 1
  • 2
  1. 首先npm install --save babel-polyfill

  2. 然后在main.js中的最前面引入babel-polyfill

    import 'babel-polyfill'

  3. 在index.html 加入以下代码(非必须)

    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

  4. 在config中的webpack.base.conf.js中,修改编译配置

entry:{
    app:['babel-polyfill','./src/main.js']      
}
  • 1
  • 2
  • 3

当然,如果你只用到了 axios 对 promise进行兼容,可以只用 es6-promise

npm install es6-promise --save
  • 1

在 main.js 中的最前面 引入

import 'es6-promise/auto'

  • 1
  • 2

完成以上配置,ie9兼容就完成了

那么,就有一个问题了,build之后的dist文件只有放在服务器上才能查看,但本地如何查看呢,参考一下配置

  1. 修改config文件夹中的index.js文件,将build对象中的打包路径,'/‘改为'./',由绝对路径改为相对路径,建议将sourceMap改为false,编译的时候会快一点

    build: { assetsPublicPath: './', productionSourceMap: false, },

  2. 修改完之后,重新 npm run build ,得到新的dist文件夹

  3. 然后进入dist文件夹

    cd dist

  4. 全局安装简易node服务器

    npm install http-server -g

  5. 启动简易node服务器

    http-server

  6. 出现如下图所示,就代表你的服务器启动成功了,那你也能在5000端口查看编译打包后的项目了,可以在ie浏览器中直接测试了

    43d0d64b4263605fdaa9fc1d7708f6bcfd5f750c

原文发布时间:2018年01月24日

作者:landl_ww

本文来源:CSDN  如需转载请联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
Vue组件入门(九)v-model 自定义修饰符
Vue组件入门(九)v-model 自定义修饰符
14 0
Markdown文件居然也可以直接作为Vue路由组件?
本文为Varlet组件库源码主题阅读系列第五篇,读完本文你可以了解到如何通过编写一个`Vite`插件来支持使用`md`文件直接作为路由组件。
19 0
Vue组件库文档站点的搭建思路
本文为Varlet组件库源码主题阅读系列第四篇,读完本篇,可以了解到如何使用`Vite`的`Api`接口来启动服务、如何动态生成多语言的页面路由。
16 0
前端技术-vue 组件 | 学习笔记
简介:快速学习前端技术-vue 组件
17 0
vue面试题4:1.组件通信;2.路由嵌套;3.< keep-alive >作用
请说明< keep-alive >组件的作用 当< keep-alive >包 裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。 < keep-alive >是一个抽象组件,它自身不会渲染一个DOM元素,也不会出现在父组件链中。 当在< keep-alive >内切换组件时,它的activated 和deactivated 这两个生命周期钩子函数将会执行。
27 0
Vue 系列讲解---Vue组件
博主传送门: 叶秋学长 博主简介: 全栈领域新星创作者,新星计划第三季人工智能赛道TOP2;阿里云技术博主;退役复学在校大学生,全栈JAVA领域创作者,目光所至,皆为华夏 系列专栏跳转: Vue讲解 Spring系列 Spring Boot 系列 云原生系列(付费专栏) 今天叶秋学长带领大家继续学习vue讲解系列专栏中的Vue组件~~ 一、为什么需要组件? 一个页面逻辑很多,放在一起不利于管理,不利于开发,将一个页面分割成小小的功能块 vue组件化 应用:任何应用都是一颗组件树 1.创建组件 const cpn = Vue.extend({}):创建一个组件构造器 t
39 0
Vue系列专栏- - - VUE组件
​ 作者是名退役复学在校大学生,对jdk、spring、springboot、springcloud、mybatis等开源框架源码有一定研究,欢迎关注,和我一起交流。 一、为什么需要组件? 一个页面逻辑很多,放在一起不利于管理,不利于开发,将一个页面分割成小小的功能块 vue组件化 应用:任何应用都是一颗组件树 1.创建组件 2.创建组件语法糖写法 省去Vue.extend()的调用,可以直接使用一个对象代替 Vue.component("myCpn", {    template: `            <div>            <h1>广告</h1>
36 0
前端-vue基础69-购物车3标题组件和结算组件
前端-vue基础69-购物车3标题组件和结算组件
21 0
+关注
文章
问答
文章排行榜
最热
最新
相关电子书
更多
利用编译将 Vue 组件转成 React 组件
立即下载
基于VUE的单页面性能优化实践
立即下载
yqdh_58c128c6555...1510401796.pdf
立即下载