IE11 с проектом Vue-Cli: Script1002: синтаксическая ошибка - PullRequest
Новая
       40

IE11 с проектом Vue-Cli: Script1002: синтаксическая ошибка

0 голосов
/ 22 мая 2019

Мое приложение прекрасно работает в Chrome / Firefox / Edge, но IE11 вызывает у меня некоторые проблемы. При тестировании приложения на моем локальном хосте в консоли IE11 в консоли появляется следующая ошибка: 

SCRIPT1002: Syntax error
app.js (49143, 1)

Когда я щелкаю по приведенному выше коду, он переходит к этой части моего кода как к области возможных ошибок: 

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Config; });
class Config { <---this is line 49143

    constructor() {
    this.config = {}
        for(var i = 0; i < arguments.length; i++) {
      Object.assign(this.config, arguments[i])
        }
    }

Я предполагаю, что IE11 испытывает проблемы с ES6 или чем-то еще. Мой проект не настроен правильно для IE11?

Мой пакет.json: 

{
  "name": "test",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build --report --modern",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.18",
    "@fortawesome/free-solid-svg-icons": "^5.8.2",
    "@fortawesome/vue-fontawesome": "^0.1.6",
    "animate.css": "^3.7.0",
    "axios": "^0.18.0",
    "bootstrap": "^4.2.1",
    "bootstrap-vue": "^2.0.0-rc.20",
    "jquery": "^3.4.1",
    "jso": "^4.1.1",
    "vue": "^2.6.10",
    "vue-matomo": "^0.6.0",
    "vue-popperjs": "^1.6.1",
    "vue-router": "^3.0.6"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.7.0",
    "@vue/cli-plugin-eslint": "^3.7.0",
    "@vue/cli-service": "^3.7.0",
    "@vue/eslint-config-prettier": "^4.0.1",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.2.2",
    "node-sass": "^4.12.0",
    "sass-loader": "^7.1.0",
    "vue-template-compiler": "^2.6.10"
  }
}

Babel.config.js 

module.exports = {
  presets: ['@vue/app']
}

.browserslistrc 

> 1%
last 2 versions
not ie <= 8

Спасибо за любые советы, которые вы можете предоставить!

Обновление: Возможно, проблема с babel-transpiler?

Вот мой демонстрационный код. Как видите, в IE11 не работает: https://codesandbox.io/embed/bootstrapvue-table-assigness-and-checkbox-final-h5vst

1 Ответ

1 голос
/ 22 мая 2019

В прошлый раз, когда мне приходилось сталкиваться с такой ошибкой, я пришел к следующему решению:

babel.config.js 


module.exports = function (api) {
  const config = {
    "presets": [
      ["@babel/env", {
        "targets": {
          "browsers": [
            "last 4 versions",
            "IE 11"
          ]
        }
      }],
      // "@babel/stage-0"
    ],
    plugins: [
      // Stage 0
      "@babel/plugin-proposal-function-bind",

      // Stage 1
      "@babel/plugin-proposal-export-default-from",
      "@babel/plugin-proposal-logical-assignment-operators",
      ["@babel/plugin-proposal-optional-chaining", {"loose": false}],
      ["@babel/plugin-proposal-pipeline-operator", {"proposal": "minimal"}],
      ["@babel/plugin-proposal-nullish-coalescing-operator", {"loose": false}],
      "@babel/plugin-proposal-do-expressions",

      // Stage 2
      ["@babel/plugin-proposal-decorators", {"legacy": true}],
      "@babel/plugin-proposal-function-sent",
      "@babel/plugin-proposal-export-namespace-from",
      "@babel/plugin-proposal-numeric-separator",
      "@babel/plugin-proposal-throw-expressions",

      // Stage 3
      "@babel/plugin-syntax-dynamic-import",
      "@babel/plugin-syntax-import-meta",
      ["@babel/plugin-proposal-class-properties", {"loose": false}],
      "@babel/plugin-proposal-json-strings",
      ["transform-es2015-template-literals", {
        // "loose": true,
        "spec": true
      }],
      ["@babel/plugin-transform-runtime", {
        "helpers": false,
        "regenerator": true
      }]
    ],
  };
  return config;
};

ofc, все эти плагины Babel должны быть установлены как devDependencies.

...