2024年Web前端最新Vue 中使用 babel-polyfill 来兼容低版本浏览器，一位Web前端大牛的BAT面试心得与经验总结

ajax

1)ajax请求的原理/ 手写一个ajax请求？
2)readyState？
3)ajax异步与同步的区别？
4)ajax传递中文用什么方法？

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

require(“es6-promise”).polyfill()

import axios from ‘axios’

当然，你也可以使用 import 的方式：

// request.js

import ‘es6-promise/auto’

import axios from ‘axios’

ok，现在问题解决了【IE和低版本的安卓设备都没问题了】：

方案二、使用 babel-polyfill

npm install babel-polyfill -S

// 在 main.js 首行引入即可

import “babel-polyfill”

因为我的项目中是有对 axios 进行封装的，而且我也不喜欢在 main.js 中来做这个操作，所以我将这个操作移到了 request.js 这个文件的开头。（request.js 的用途是用来对 axios 进行封装），所以我的是下面这样。

// request.js

import ‘babel-polyfill’

import axios from ‘axios’

或者：

webpack.config.js 中：

module.exports = {

// entry: {

// app: ‘./src/main.js’

// },

entry: [‘babel-polyfill’, ‘./src/main.js’],

}

将原来的

entry: {

app: ‘./src/main.js’

}

改为：

entry: [‘babel-polyfill’, ‘./src/main.js’]

重新执行构建命令，问题同样解决了，IE和低版本安卓设备都可以正常发送请求了。很棒！

Tip

=================================================================

最后还是有一点提示想对你说：

1、不管是方案一还是方案二，建议的使用方式都是在 request.js 的头部引入。

2、es6-promise 和 babel-polyfill 文件大小的问题：

两者体积大小没有明显差异。

---

OK，写完了，希望可以帮到你们。提前祝大家周末愉快。

---------------------------(正文完)------------------------------------

一个 Vue 的学习交流群，想进来面基的，可以点击这个logo，或者手动search群号：685486827

写在最后： 约定优于配置-------软件开发的简约原则.

总结

技术学到手后，就要开始准备面试了，找工作的时候一定要好好准备简历，毕竟简历是找工作的敲门砖，还有就是要多做面试题，复习巩固。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

了，找工作的时候一定要好好准备简历，毕竟简历是找工作的敲门砖，还有就是要多做面试题，复习巩固。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

[外链图片转存中…(img-vQBBvLqM-1715431197875)]