Question

经过两天的挖掘，我只有一个问题。如何使用babel-plugin-relay而不是弃用babel-relay-plugin？

到目前为止我做了什么：

我有这个带有json的.babelrc：

{
  "presets": [
    "es2015",
    "stage-0",
    "react"
  ],
  "plugins": [
    ["relay", {"compat": true, "schema": "./graphql/schema.graphql"}]
  ]
}

来自relay-starter-kit的updateSchema.js文件。

webpack.config.js，其中包含以下行：

...
module: {
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
        query: {
          presets: ['es2015', 'react', 'stage-0'],
          plugins: [path.resolve(__dirname, 'graphql', 'babelRelayPlugin')],
        },
      },
...

projectRoot / graphql / babelRelayPlugin.js，代码如下：

const getbabelRelayPlugin = require('babel-relay-plugin');
const schema = require('./schema.json');

module.exports = getbabelRelayPlugin(schema.data);

当我试图摆脱babel-relay-plugin并将其更改为babel-plugin-react时documenation鼓励 - 我发现Relay.QL``查询就是这样的错误：

./app.jsx中的错误模块构建失败：错误： /Users/Vadim/Dropbox/WebStormProjects/mulibwanji/client/src/app.jsx： babel-plugin-relay：缺少架构选项。检查.babelrc文件或无论你在哪里配置你的Babel插件，以确保“中继”插件有一个“架构”选项。

我做错了什么？我无法得到使用这个babel-plugin-relay的Relay Classic的线索......在迁移到babel-plugin-relay之后肯定不会在文档中做什么babelRelayPlugin文件。

Answer 1

此刻我发现只有一种解决方法，并不确定这是一个好习惯。我受到this commit的启发，最终没有被接受。

我已添加babel-plugin-relay-loader个babel-plugin-relay个npm包，已删除的babelRelayPlugin.js文件也添加到我的package.json行中：

...
  "metadata": {
    "graphql": {
      "schema": "./graphql/schema.json"
    }
  }
...

<{1}}中的

js loaders部分如下所示：

webpack.config.js

我留下的... { test: /\.jsx?$/, exclude: /node_modules/, loader: 'babel-loader', query: { presets: ['es2015', 'react', 'stage-0'], plugins: ['babel-relay-plugin-loader'], }, }, ...文件如下：

.babelrc

它有效，但我仍在寻找更好的解决方案

如何使用新的babel-plugin-relay和Relay Classic？

1 个答案: