Next-plugins: Error when using it with next 5

Created on 15 Feb 2018  路  4Comments  路  Source: vercel/next-plugins

yarn run v1.3.2
$ rimraf node_modules/.cache/babel-loader && next
> Using external babel configuration
> Location: "/project/.babelrc"
(node:23917) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): TypeError: extractedChunk.getNumberOfModules is not a function
(node:23917) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 2): TypeError: extractedChunk.getNumberOfModules is not a function

My next.config.js

// https://github.com/zeit/next.js/blob/master/examples/with-global-stylesheet

const path = require('path');
const glob = require('glob');
const withCSS = require('@zeit/next-css')

module.exports = withCSS({
  webpack(config, { dev, isServer }) {
    //const originalEntry = config.entry
    //config.entry = async () => {
      //const entries = await originalEntry()

      //if (entries['main.js']) {
        //entries['main.js'].unshift('./client/polyfills.js')
      //}

      //return entries
    //}

    // Set project root path as part of the resoler
    config.resolve = {
      modules: [
        ...config.resolve.modules,
        path.resolve('./')
      ]
    }

    // Original Issue:
    // https://github.com/zeit/next.js/issues/1877#issuecomment-299396974
    //if (config.resolve.alias) {
      //delete config.resolve.alias['react'];
      //delete config.resolve.alias['react-dom'];
    //}

    // TODO: Remove this once nextjs issue has been resolved: https://github.com/zeit/next.js/issues/1582
    //config.plugins = config.plugins.filter(plugin => {
      //if (plugin.constructor.name === 'UglifyJsPlugin') {
        //return false;
      //} else {
        //return true;
      //}
    //});

    config.module.rules.push(
      // yaml
      {
        test: /\.yaml$/,
        use: [
          {
            loader: 'emit-file-loader',
            options: {
              name: 'dist/[path][name].[ext]'
            }
          },
          'json-loader',
          'yaml-loader'
        ]
      },

      {
        test: /\.(graphql|gql)$/,
        exclude: /node_modules/,
        use: [
          {
            loader: 'emit-file-loader',
            options: {
              name: 'dist/[path][name].[ext]'
            }
          },
          'babel-loader',
          'graphql-tag/loader'
        ]
      }
    );

    return config;
  }
});

Most helpful comment

Fixed it by forcing webpack 3 by running
$ yarn add webpack@^3.10.0

All 4 comments

Sounds like something in your configuration. Not much we can do.

You mean a conflict with other plugins? Is there a recommended way to debug this?

I have this issue whenever I call withCss or withSass plugins to next.config.js

I think the webpack that come with next 5 doesn't support the function call that next-sass or next-css is calling.

Fixed it by forcing webpack 3 by running
$ yarn add webpack@^3.10.0

Was this page helpful?
0 / 5 - 0 ratings