Error: next.config.js must be one of: serverless, experimental-serverless-trace

[franciscorubin]

I'm getting the following error on my fresh netlify app:

7:03:03 PM:   Error message
7:03:03 PM:   Error: next.config.js must be one of: serverless, experimental-serverless-trace
7:03:03 PM: ​
7:03:03 PM:   Plugin details
7:03:03 PM:   Package:        @netlify/plugin-nextjs
7:03:03 PM:   Version:        1.0.5
7:03:03 PM:   Repository:     git+https://github.com/netlify/netlify-plugin-nextjs.git
7:03:03 PM:   npm link:       https://www.npmjs.com/package/@netlify/plugin-nextjs
7:03:03 PM:   Report issues:  https://github.com/netlify/netlify-plugin-nextjs/issues
7:03:03 PM: ​
7:03:03 PM:   Error location
7:03:03 PM:   In "onPreBuild" event in "@netlify/plugin-nextjs" from Netlify app
7:03:03 PM:       at onPreBuild (/.netlify/plugins/node_modules/@netlify/plugin-nextjs/index.js:60:16)

I have the following plugins:

7:02:40 PM:    - @netlify/plugin-nextjs@1.0.5
7:02:40 PM:    - netlify-plugin-cache-nextjs@1.4.0

[lindsaylevine]

hey @pancho111203! what does your next.config.js look like?

[franciscorubin]

const withLess = require('@zeit/next-less');
const lessToJS = require('less-vars-to-js');
const fs = require('fs');
const path = require('path');
const withOptimizedImages = require('next-optimized-images');

// Where your antd-custom.less file lives
const themeVariables = lessToJS(
  fs.readFileSync(path.resolve(__dirname, './assets/antd-custom.less'), 'utf8')
);

const webpackObj = withOptimizedImages(
  withLess({
    lessLoaderOptions: {
      javascriptEnabled: true,
      modifyVars: themeVariables,
    },
    webpack: (config, { isServer }) => {
      if (isServer) {
        const antStyles = /antd\/.*?\/style.*?/;
        const origExternals = [...config.externals];
        config.externals = [
          (context, request, callback) => {
            if (request.match(antStyles)) {
              return callback();
            }
            if (typeof origExternals[0] === 'function') {
              origExternals[0](context, request, callback);
            } else {
              callback();
            }
          },
          ...(typeof origExternals[0] === 'function' ? [] : origExternals),
        ];

        config.module.rules.unshift({
          test: antStyles,
          use: 'null-loader',
        });
      }
      return config;
    },
  })
);

webpackObj['rewrites'] = async function() {
  return [
    {
      source: '/blog/wp-admin',
      destination: '.....',
    },
    {
      source: '/blog/:path*',
      destination: '.....',
    },
  ]
}

module.exports = webpackObj;

[lindsaylevine]

@pancho111203 can you set config.target to serverless? we try to do this for you within the plugin, but this is a great example of an "edge case" where people are using this format for their config file, where our logic won't work.

at the very least, for now, i'll update the error message to be way more clear. let me know if setting config.target fixes your issue!!

[lindsaylevine]

78a0986

[franciscorubin]

@lindsaylevine Great, that fixes it! Thanks a lot