Загрузчик пакетов Nextjs-Graphql: как интегрировать Nextjs с загрузчиком Graphql - PullRequest
Новая
       46

Загрузчик пакетов Nextjs-Graphql: как интегрировать Nextjs с загрузчиком Graphql

0 голосов
/ 17 сентября 2018

Я пытаюсь интегрировать Nextjs с graphql-tag / loader, это мой next.config.js файл: 

const withSass = require('@zeit/next-sass')
const graphqlLoader = require('graphql-tag/loader')

module.exports = withSass({
  webpack: (config, { buildId, dev, isServer, defaultLoaders }) => {
    config.module.rules.push({
      test: /\.(graphql|gql)$/,
      loader: graphqlLoader,
      exclude: /node_modules/
    })

    return config
  }
})

Я не могу собрать, я получаю ошибку ниже: 

/HOME/node_modules/graphql-tag/loader.js:43
  this.cacheable();
       ^
TypeError: Cannot read property 'cacheable' of undefined

Пожалуйста, помогите.

1 Ответ

0 голосов
/ 17 сентября 2018

я сделал это, работая в моей настройке следующим образом.Не уверен, что не так в вашем коде, но вы можете попробовать и посмотреть, работает ли он :) Вы можете использовать следующий плагин js для него.Может быть, порядок плагинов имеет значение.Вот мой конфиг.Есть некоторый дополнительный код, но я уверен, что вы получите то, что вам нужно от него.Что касается версий библиотек "next": "6.1.1", "next-optimized-images": "1.4.1", "next-plugin-graphql": "^ 0.0.1", 

const withSass = require("@zeit/next-sass");
const webpack = require("webpack");
const withGraphQL = require("next-plugin-graphql");
const withOptimizedImages = require("next-optimized-images");

module.exports = withOptimizedImages(
  withGraphQL(
    withSass({
      cssModules: true,
      cssLoaderOptions: {
        importLoaders: 1,
        localIdentName: "[local]___[hash:base64:5]"
      },
      webpack: config => {

        config.plugins.push(
          new webpack.ContextReplacementPlugin(
            /graphql-language-service-interface[\\/]dist$/,
            new RegExp(`^\\./.*\\.js$`)
          )
        );

        return config;
      }
    })
  )
);

Если вы предпочитаете просто изменить свой код и не устанавливать плагины, вы можете вдохновиться этим next-graphql-plugin .Плагин работает для меня, отличие от ваших настроек в том, что они настроили правило следующим образом 

  config.module.rules.push({
       test: /\.(graphql|gql)$/,
       include: [dir],
       exclude: /node_modules/,
       use: [
           {
             loader: 'graphql-tag/loader'
           }
       ]
    })
...