使用Feathers.js时如何使Vue.js应用程序与IE 11一起使用

问题描述

在创建标准vue应用程序(使用vue-cli v3.0)并包含@feathersjs/feathers以实现与Feathers API的连接时，Internet Explorer 11(SCRIPT1010: Expected identifier)出现错误

When creating a standard vue app (using vue-cli v3.0) and including @feathersjs/feathers in order to implement a connection with a feathers API, I get an error with Internet Explorer 11 (SCRIPT1010: Expected identifier)

最重要的是找到一种解决此类问题的简便方法，因为在较大的项目中，人们可以轻松地发现许多库问题，并且有时必须支持至少一个版本的Internet Explorer(至少从业务角度而言)的观点)

The bottom line is to find an easy way to solve issues like this, because on bigger projects one could easily find lots of library issues and sometimes is necessary to support at least one version of Internet Explorer (at least from the business point of view)

我在羽毛网站上阅读( https://docs.feathersjs.com/api/client.html#module-loaders )，该库使用ES6，因此在这种情况下，必须对其进行编译才能在IE11之类的浏览器中工作.

I read on feathers site (https://docs.feathersjs.com/api/client.html#module-loaders) that the library uses ES6 so in this case it must be transpiled in order to work in a browser like IE11.

所以我尝试了这个，但是一点都没有运气:

So I tried this but had no luck at all:

// vue.config.js
module.exports = {
  baseUrl: '/',
  transpileDependencies: [
    '@feathers/commons',
    '@feathers/errors',
    '@feathers/feathers',
    'debug'
  ]
}

甚至在Chrome中也出现错误:Uncaught ReferenceError: exports is not defined

and got errors even in chrome: Uncaught ReferenceError: exports is not defined

我创建了一个项目来显示此错误: https://github.com/riescorp/vue-internet-explorer

I created a project to show this error: https://github.com/riescorp/vue-internet-explorer

即使它无法快速运行或看起来不错，但可以正常工作，该应用程序仍应能够使用IE11.

One should be able to use IE11 for this app, even if it doesn't work fast or looks nice, but works.

推荐答案

我终于设法解决了这个问题.

I finally manage to solve this issue.

这是实现窍门的babel.config.js配置:

module.exports = {
  presets: ['@vue/app'],
  plugins: ['@babel/transform-modules-commonjs']
}

我的vue.config.js中也有一个错字，它应该像这样:

Also there was a typo in my vue.config.js it should look like this:

// vue.config.js
module.exports = {
  baseUrl: '/',
  transpileDependencies: [
    '@feathersjs',
    'debug'
  ]
}

最后，当使用羽毛时，此行不起作用:

Finally, when using feathers this line wouldn't work:

.configure(restClient.fetch(window.fetch))

因此您可以使用import 'whatwg-fetch'来解决它(请记住安装npm i whatwg-fetch)

so you can use import 'whatwg-fetch' to solve it (remember to install it npm i whatwg-fetch)

这篇关于使用Feathers.js时如何使Vue.js应用程序与IE 11一起使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！