Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
franciscorubin opened this issue Jan 11, 2021 · 5 comments

Comments

@franciscorubin
Copy link

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
Copy link

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

@franciscorubin
Copy link
Author

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
Copy link

@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
Copy link

78a0986

@franciscorubin
Copy link
Author

@lindsaylevine Great, that fixes it! Thanks a lot

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants