时间戳

首页 > 解决方案 > SCRIPT1003：在 IE ~ Vue.js ~ MDBootstrap 上预期为 ':'

javascript - SCRIPT1003：在 IE ~ Vue.js ~ MDBootstrap 上预期为 ':'

问题描述

我有一个简单的 Vue.js 应用程序，它可以在 IE 以外的其他浏览器上完美运行，它显示一个带有错误的空白页面SCRIPT1003: Expected ':'。我添加了一个vue.config.js看起来像这样的文件：

module.exports = {
  transpileDependencies: ["bootstrap-css-only", "mdbvue"]
};

我的.babelrc文件是从官方项目起始页获取的默认文件，这是：

{
  "presets": [
    [
      "env",
      {
        "modules": false,
        "targets": {
          "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
        }
      }
    ],
    "stage-2"
  ],
  "plugins": ["transform-vue-jsx", "transform-runtime"]
}

在我的main.js文件中，我尝试了 2 种方法：

import "core-js/stable";
import "regenerator-runtime/runtime";

和

import "@babel/polyfill";

两者都没有改变任何东西，错误和行为是相同的。这里提到了我仍然想到解决这个问题的唯一一件事，即在export default我对组件使用以下语法时：

components: {
  mdbContainer,
  mdbRow,
  mdbCol,
  mdbCard,
  mdbCardBody,
  mdbInput,
  mdbBtn,
  mdbIcon,
  mdbModalFooter,
  mdbView
}

Edit2：但是如果我删除这些行，那么我所有来自 MDBootstrap 的 UI 元素都将消失。有没有其他方法可以使用它？我只想使用 polyfills。

我试图创建babel.config.js文件，但也没有帮助。这个文件中的逻辑是这样的：

module.exports = {
  presets: [["@vue/app", { useBuiltIns: "entry" }]]
};

有什么我想念的吗？我所理解的vue.config.js文件不必在任何地方导入，因为vue.config.js它是一个可选的配置文件，它将由@vue/cli-service. 以下是我的问题：

  1. 有什么想法可能是错的吗？
  2. 我应该拥有babel.config.js 和 .babelrc/或只有其中之一吗？
  3. babel.config.js文件会自动检测到吗vue.config.js？
  4. [编辑] 也许应该更改 webpack 配置中的某些内容？

Vue CLI 版本：

$ vue --version
3.11.0

标签： javascriptvue.jswebpackbabeljsmdbootstrap

解决方案

我有一个类似的问题。我使用重新创建项目vue-cli 4并保留所有默认值。我没有引用babel或core-js在我的main.js. 我查看了 IE 中的控制台错误，看看是哪个库导致了脚本错误，（让我们调用它some-imported-lib）。vue.config.js然后我按如下方式添加了该库

transpileDependencies:['some-imported-lib']

推荐阅读