1.pc页面在IE11报错

最近在做PC端的页面，引入了 three.js （3d动画）和 vue-baidu-map （百度地图）以及 vue-awesome-swiper （定制轮播，采用了高版本的swiper），在chrome浏览器和edg是没有问题的，但是在ie11以及下是不行的，并且因为报错阻塞了页面一些业务逻辑的运行。

先来看一下在IE11中的报错（这里只举例引入 vue-awesome-swiper 引发的错误）

看到错误信息：

2.错误原因

可以看到是因为引入swiper（ vue-awesome-swiper 安装时会同时安装swiper）的包，导致的错误，而在这个文件中有许多的es6的语法，应该是 没有编译导致的错误

3.解决方案

因为我采用的是vue的nuxt，方法如下：
修改nuxt.config，增加：

build: {
    transpile: [
      'swiper',
      'dom7',
      'vue-baidu-map',
      'three'
transpile表示需要使用Babel转换特定的依赖项，是一个数组。
 可参考nuxt 的 api：https://zh.nuxtjs.org/docs/2.x/configuration-glossary/configuration-build/#transpile
                    1.pc页面在IE11报错最近在做PC端的页面，引入了three.js（3d动画）和vue-baidu-map（百度地图）以及vue-awesome-swiper（定制轮播，采用了高版本的swiper），在chrome浏览器和edg是没有问题的，但是在ie11以及下是不行的，并且因为报错阻塞了页面一些业务逻辑的运行。先来看一下在IE11中的报错（这里只举例引入vue-awesome-swiper引发的错误）看到错误信息：2.错误原因可以看到是因为引入swiper（vue-awesome-swi
下面是个人在这半个月使用nuxt框架遇到的一些问题，记录一下：
1，首先一个是关于nuxt.config.js的配置问题，在plugins引入一些第三方插件的时候，如果不需要SSR，可以在后面选择ssr:false进行关闭。这样可以避免一些window未定义的问题。
2，接着是window o...
export default function (context) {
  const userAgent = process.server ? context.req.headers['user-agent'] : navigator.userAgent
  let re = new RegExp("MS...
使用过的都知道，nuxt没有暴露主入口页面也就是index.html啊，我们以前常用的IE条件判断没地方写。
鉴于css flex布局的广泛使用性，我们选择拦截IE9及以下的浏览器。
说明： nuxt 兼容IE9及以上，flex 兼容IE10及以上，而国内浏览器大多采用w...
				pc项目在其他浏览器包括edge都正常显示，但在IE浏览器报语法错误，页面的点击事件都无正常使用。
上网搜索资料得知，可能是因为插件中使用了ES6的语法，导致IE无法解析，阻塞了页面逻辑的运行。
最后的解决方案：（此项目采用的是vue的nuxt）
修改nuxt.config，增加：
build: {
    transpile: [
      ‘vue-persist’  // 出错插件的名称
参考地址：https://blog.csdn.net/haochangdi123/art
  var userAgent = navigator.userAgent;
  var isLessIE11 =
    userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1;
  var isEdge = userAgent.i
				在IE 上使用Vuex的过程中，出现如下错误：
SCRIPT5022: [vuex] vuex requires a Promise polyfill in this browser. 
解决方法：
1、先安装babel-polyfill
npm install --save-dev babel-polyfill
2、webpack.base.config.js下修改文件
entry: {
  'babel-polyfill': 'babel-polyfill',
  app: './src/main.js'
以上这篇解决VUEX兼容IE上的报错问题就是小编分享给大家的全部内容了
				如果你在使用 Nuxt.js 框架时引入了 quill-image-resize-module，并且出现了错误，请按照以下步骤进行解决：
1. 确保已经安装了 quill 和 quill-image-resize-module：
```bash
npm install quill quill-image-resize-module
2. 在 nuxt.config.js 文件中添加插件配置：
```javascript
plugins: [
  { src: '~plugins/quill.js', ssr: false }
3. 在 plugins 目录下创建 quill.js 文件，并添加以下代码：
```javascript
import Vue from 'vue'
import Quill from 'quill'
import ImageResize from 'quill-image-resize-module'
Vue.use(ImageResize)
if (process.browser) {
  const VueQuillEditor = require('vue-quill-editor/dist/ssr')
  Vue.component('quill-editor', VueQuillEditor)
4. 在页面或组件中使用 quill-editor 组件：
```html
<template>
    <quill-editor v-model="content" />
</template>
<script>
export default {
  data() {
    return {
      content: '',
</script>
这样就可以在 Nuxt.js 中使用 quill-image-resize-module 了。如果还有其他问题，请及时反馈。