Question

我一直试图将大量Babel功能引入React / GraphQL项目，而我主要是手工编写。但是我尝试使用这个构建脚本来生成schema.graphql文件：

  import fs from 'fs';
  import path from 'path';
  import { graphql } from 'graphql';
  import { introspectionQuery, printSchema } from 'graphql/utilities';

  import schema from '../server/schema';

  let file_schema_json = path.join(__dirname, '../graphql/schema.json');
  let file_schema_graphql = path.join(__dirname, '../graphql/schema.graphql');

  // Save JSON of full schema introspection for Babel Relay Plugin to use
  async function createJson( )
  {
    var result = await( graphql( schema, introspectionQuery ) );
    if( result.errors )
    {
      console.error( 'ERROR! ' );
      console.error( 'ERROR introspecting schema: ', JSON.stringify(result.errors, null, 2) );
    }
    else
    {
      fs.writeFileSync( file_schema_json, JSON.stringify(result, null, 2) );
      console.log( 'Written: ' + file_schema_json );
    }
  }

  // Save user readable type system shorthand of schema
  fs.writeFileSync( file_schema_graphql, printSchema( schema ) );
  console.log( 'Written: ' + file_schema_graphql );

  createJson( );

然后我最终得到了：

  /Users/lorm/projects/aggregated_centralized_api/node_modules/babel-core/lib/transformation/file/index.js:591
        throw err;
        ^

  SyntaxError: /Users/lorm/projects/aggregated_centralized_api/scripts/build-schema.js: Unexpected token (12:6)
    10 | 
    11 | // Save JSON of full schema introspection for Babel Relay Plugin to use
  > 12 | async function createJson( )
       |       ^
    13 | {
    14 |   var result = await( graphql( schema, introspectionQuery ) );
    15 |   if( result.errors )

但我复制了我能想到的所有依赖项：

"dependencies": {
"babel-cli": "^6.8.0",
"babel-core": "^6.8.0",
"babel-eslint": "^6.0.4",
"babel-loader": "^6.2.4",
"babel-plugin-react-transform": "^2.0.2",
"babel-plugin-transform-async-to-generator": "^6.8.0",
"babel-polyfill": "^6.8.0",
"babel-preset-es2015": "^6.6.0",
"babel-preset-react": "^6.5.0",
"babel-preset-stage-0": "^6.5.0",
"babel-relay-plugin": "^0.8.1",
"babel-relay-plugin-loader": "^0.8.1",
"babel-runtime": "^6.6.1",
"body-parser": "1.15.1",
"dataloader": "1.1.0",
"dotenv": "2.0.0",
"express": "4.13.4",
"express-graphql": "^0.5.3",
"graphql": "0.4.18",
"graphql-relay": "0.3.6",
"mongodb": "2.0.39",
"q": "1.4.1"
},
"devDependencies": {
"babel": "^5.8.3",
"babel-core": "^5.8.3",
"babel-eslint": "^4.0.5",
"babelify": "^6.1.1",
"babel-cli": "^6.8.0",
"babel-jest": "^12.0.2",
"babel-plugin-transform-runtime": "^6.8.0",
"babel-polyfill": "^6.8.0",
"eslint": "^0.24.0",
"eslint-plugin-react": "^3.2.2",
"flow-bin": "^0.22.1"
},

然而，它似乎还没有被触发？或者不知道如何阅读这种Javascript？什么会导致这个错误？

Answer 1

我认为您没有异步语法所需的插件支持。我快速浏览了http://babeljs.io/docs/plugins/

您目前安装了以下预设和插件：

巴别预置-ES2015
巴别预置反应的
巴别预置级-0

如果您转到上面的链接并单击它们，您将看到这些预设中捆绑了哪些插件。看起来异步语法不包含在那些中。

这里有一个有用的帖子关于让它正常工作：http://madole.xyz/async-await-es7/

点击此处的帖子更新：http://madole.xyz/babel-plugin-transform-async-to-module-method-gotcha/

我想您的另一个选择是删除异步代码并将其替换为其他代码。 graphql api会返回promises吗？如果是这样，你可以重构它以使用promises语法。或者发电机。

哦，这是一本涵盖承诺和发电机的伟大电子书： https://github.com/getify/You-Dont-Know-JS/tree/master/async%20%26%20performance

关于async / await的博客：https://ponyfoo.com/articles/understanding-javascript-async-await

NodeJS / Babel SyntaxError意外的令牌

1 个答案: