Декоратор TypeGraphQL @Arg завершается с ошибкой синтаксического анализатора при переносе через веб-пакет и загрузчик babel - PullRequest
Новая
       35

Декоратор TypeGraphQL @Arg завершается с ошибкой синтаксического анализатора при переносе через веб-пакет и загрузчик babel

0 голосов
/ 01 февраля 2020

Я использую typegraphql для создания резольверов graphql из классов машинописи, украшенных аннотацией @Resolver. Я могу переносить / связывать свой исходный код с помощью веб-пакета и загрузчика babel, если я не добавляю декоратор @Arg, чтобы определить аргумент для моего метода распознавателя.

Ниже приведена конфигурация моего веб-пакета (по крайней мере, тот раздел, который мне подходит): 

loader: "babel-loader",
options: {
    presets: ["@babel/preset-env", "@babel/preset-typescript"],
    plugins: [
        "@babel/plugin-transform-runtime",
        ["@babel/plugin-proposal-decorators", { legacy: true }],
        ["@babel/plugin-proposal-class-properties", { loose: true }],
    ],
},

Ниже приведен мой распознаватель с декоратором @Arg: 

@Resolver()
export default class TimesheetResolver implements TimesheetQuery {
    @Query(() => [Timesheet])
    async findAllEmployeeTimesheets(@Arg("employeeId") employeeId: string): Promise<[Timesheet]> {
        ...
    }
}

Ниже приведен мой файл tsconfig: 

{
    "compilerOptions": {
      /* Basic Options */
      "target": "es2016",                       /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
      "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
      "lib": ["es2016", "esnext.asynciterable"],
      "declaration": true,                      /* Generates corresponding '.d.ts' file. */
      "outDir": "lib",                          /* Redirect output structure to the directory. */
      /* Strict Type-Checking Options */
      "strict": true,                           /* Enable all strict type-checking options. */
      "allowSyntheticDefaultImports": true,     /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
      "esModuleInterop": true,                  /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
      /* Experimental Options */
      "experimentalDecorators": true,        /* Enables experimental support for ES7 decorators. */
      "emitDecoratorMetadata": true,         /* Enables experimental support for emitting type metadata for decorators. */
    }
  }

Ошибка веб-пакета: 

ERROR in ./src/api/timesheet/TimesheetQuery.ts 28:48
Module parse failed: Unexpected character '@' (28:48)
File was processed with these loaders:
 * ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|       var _findAllEmployeeTimesheets = _asyncToGenerator(
|       /*#__PURE__*/
>       _regeneratorRuntime.mark(function _callee(@Arg("employeeId")
|       employeeId) {
|         var timesheet, timeEntry, workBreak, clockIn, clockOut;
 @ ./src/graphql/server.ts 5:0-64 21:26-43
 @ ./src/index.ts
 @ multi ./src/index.ts

Есть ли плагин или другой загрузчик, который мне нужно включить в конфигурацию моего веб-пакета?

1 Ответ

2 голосов
/ 01 февраля 2020

Я добавил babel-plugin-transform-typescript-metadata в мой webpack.config. js файл , как предложено автором typegraphql.

Добавление Новый плагин исправил мою проблему. Ниже приводится обновленный файл webpack.config. js

use: {
                    loader: "babel-loader",
                    options: {
                        presets: ["@babel/preset-env", "@babel/preset-typescript"],
                        plugins: [
                            "@babel/plugin-transform-runtime",
                            "babel-plugin-transform-typescript-metadata",
                            ["@babel/plugin-proposal-decorators", { legacy: true }],
                            ["@babel/plugin-proposal-class-properties", { loose: true }],
                        ],
                    },
                },
...