语法错误: 'import' 和 'export' 只能出现在 'sourceType: module' 模式下 (1:0)

Question

我会尽力帮助您翻译。以下是您需要翻译的内容：

我一直遇到这个错误。最近发生了几次，现在我无法摆脱它。我在我的React Native项目中使用MobX，所以我需要在我的.babelrc中添加一些内容来支持装饰器：

{
  "presets": ["react-native"],
  "plugins": ["transform-decorators-legacy"]
}

我尝试了几种不同的变化，但都给我以下错误。如果我删除它，由于不支持装饰器而出现错误。

SyntaxError: 'import' and 'export' may appear only with 'sourceType: module' (1:0)
    at Parser.pp$5.raise (/path-to/node_modules/babylon/lib/index.js:4246:13)
    at Parser.pp$1.parseStatement (/path-to/node_modules/babylon/lib/index.js:1749:16)
    at Parser.pp$1.parseBlockBody (/path-to/node_modules/babylon/lib/index.js:2133:21)
    at Parser.pp$1.parseTopLevel (/path-to/node_modules/babylon/lib/index.js:1645:8)
    at Parser.parse (/path-to/node_modules/babylon/lib/index.js:1537:17)
    at Object.parse$1 [as parse] (/path-to/node_modules/babylon/lib/index.js:6466:37)
    at extractDependencies (/path-to/node_modules/react-native/packager/react-packager/src/JSTransformer/worker/extract-dependencies.js:29:23)
    at transform (/path-to/node_modules/react-native/packager/react-packager/src/JSTransformer/worker/index.js:53:9)
    at module.exports (/path-to/node_modules/react-native/packager/transformer.js:130:3)
    at transformCode (/path-to/node_modules/react-native/packager/react-packager/src/JSTransformer/worker/index.js:27:3)
transformed 35/139 (25%)/path-to/node_modules/babylon/lib/index.js:4249
  throw err;

我尝试了几次删除我的node_modules并重新安装。我正在使用yarn。在再次运行yarn install之前，还删除了锁定文件。

我按照这个指南安装Babel插件。我的package.json看起来像：

  "dependencies": {
    "apsl-react-native-button": "^3.0.0",
    "mobx": "^2.5.0",
    "mobx-react": "^3.5.5",
    "react": "15.3.2",
    "react-native": "0.37.0",
    "react-native-autogrow-textinput": "^2.0.3",
    "react-native-awesome-button": "^1.6.0",
    "react-native-couchbase-lite": "git://github.com/adamski/react-native-couchbase-lite.git#gradle-experimental",
    "react-native-keep-awake": "git://github.com/adamski/react-native-keep-awake.git#experimental-gradle",
    "react-native-keyboard-aware-view": "^0.0.11",
    "react-native-keyboard-dodging-view": "git://github.com/adamski/react-native-keyboard-dodging-view#upper-text-inputs",
    "react-native-modalbox": "^1.3.4",
    "react-native-navigation": "git://github.com/adamski/react-native-navigation.git#gradle-experimental-update",
    "react-native-searchbar": "^0.4.2",
    "react-native-simple-store": "^1.0.1",
    "react-native-swipe-list-view": "^0.3.1"
  },
  "devDependencies": {
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-preset-react-native": "^1.9.1"
  }

我尝试更新到RN 0.38，但仍然遇到相同的错误。

运行ag babylon会产生以下结果：

yarn.lock
200:    babylon "^6.11.0"
885:    babylon "^6.11.0"
896:    babylon "^6.11.0"
911:babylon@^6.11.0, babylon@^6.13.0, babylon@^6.13.1:
913:  resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.14.1.tgz#956275fab72753ad9b3435d7afe58f8bf0a29815"
3478:    babylon "^6.13.0"
3555:    babylon "^6.13.1"

这是否暗示着不同版本的 Babylon 之间存在冲突？

有人能告诉我这个错误消息实际上是什么意思吗？这是我的代码有问题，还是我的模块中 Babel 版本不匹配导致的？

- Adamski

---

哪个模块没有被导入？ - Codesingh

@Codesingh 我不知道... - Adamski

从您的项目根目录运行npm uninstall。 - Codesingh

让我看看你的 package.json 文件。 - Codesingh

@Codesingh 添加了完整的 package.json 详细信息。 - Adamski

Answer 1

我认为有一个相关的包，叫做babel-preset-react-native-stage-0

在你的.babelrc文件中，将"react-native-stage-0/decorator-support"添加到预设数组中

- Ricbermo

---

这就是我在.babelrc中最初的设置 - 我尝试了很多不同的选项，但仍然遇到了这个错误。也许是重建项目的时候了... - Adamski

Answer 2

我曾经遇到过同样的问题。最终我的解决方案是彻底删除.babelrc文件。然后，我不得不安装一些预设并将它们添加为开发依赖项。

具体来说：

babel-preset-es2015 babel-preset-react babel-preset-react-native

然后一切都重新开始工作了。

- Ofir D