Incompatible with Nextjs 5

hidesminimally commented 3 years ago

Hi there, Thanks for creating this starter repo! I've cloned it and updated next to "next": "^11.0.1" in package.json to run Next.js 5 and Webpack 5

and am running into the following error:

➜  eui-starter git:(master) ✗ yarn run dev
yarn run v1.22.10
$ next
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
Defining routes from exportPathMap
(node:33793) [DEP_WEBPACK_EXTERNALS_FUNCTION_PARAMETERS] DeprecationWarning: The externals-function should be defined like ({context, request}, cb) => { ... }
(Use `node --trace-deprecation ...` to show where the warning was created)
/Users/.../dev/eui-starter/node_modules/next/dist/build/webpack-config.js:560
        const isLocal = request.startsWith('.') || // Always check for unix-style path, as webpack sometimes
                                ^

TypeError: Cannot read property 'startsWith' of undefined
    at handleExternals (/Users/.../dev/eui-starter/node_modules/next/dist/build/webpack-config.js:560:33)
    at webpackConfig.externals._webpack.isWebpack5.require.resolve.paths (/Users/.../dev/eui-starter/node_modules/next/dist/build/webpack-config.js:677:24)
    at /Users/.../dev/eui-starter/next.config.js:76:18
    at /Users/.../dev/eui-starter/node_modules/next/dist/compiled/webpack/bundle5.js:56152:21
    at deprecated (node:internal/util:89:15)
    at handleExternals (/Users/.../dev/eui-starter/node_modules/next/dist/compiled/webpack/bundle5.js:56300:8)
    at next (/Users/.../dev/eui-starter/node_modules/next/dist/compiled/webpack/bundle5.js:56278:9)
    at handleExternals (/Users/.../dev/eui-starter/node_modules/next/dist/compiled/webpack/bundle5.js:56283:7)
    at /Users/.../dev/eui-starter/node_modules/next/dist/compiled/webpack/bundle5.js:56380:5
    at Hook.eval [as callAsync] (eval at create (/Users/.../dev/eui-starter/node_modules/next/dist/compiled/webpack/bundle5.js:33832:10), <anonymous>:37:1)
error Command failed with exit code 1.

It seems that html-webpack-plugin is the dependency that's causing this problem

Anyone have ideas for how to get around this?

I've tried specifying a resolution in package.json but no change:

  "resolutions": {
    "html-webpack-plugin": "5.3.2"
  },

Mentioned this in their adoption thread: https://github.com/vercel/next.js/discussions/23498#discussioncomment-620981

hidesminimally commented 3 years ago

Saw that @miukimiu posted on a similar issue that was resolved: https://github.com/elastic/next-eui-starter/issues/33#issuecomment-888395263

Are there plans for Elastic UI Kit to support Webpack 5?

chandlerprall commented 3 years ago

We don't have any active plans to upgrade this repo to the latest Next + Webpack, but it is something we want.

From reading the stack trace & next.js thread you linked to, it's may be possible this specific error can be resolved by updating some dependencies.

hidesminimally commented 3 years ago

@chandlerprall Thanks for the quick response! For clarification, do you suggest forking the repo and updating some dependencies (such as html-webpack-plugin) for this to be solved on my end? Or are you suggesting that I may be able to solve this without forking?

chandlerprall commented 3 years ago

I'd try forking and updating those dependencies. If you get a functioning build with the latest next.js and webpack (or close to a functioning build), I'd be happy to review a pull request with any changes!

DennisSnijder commented 2 years ago

I'd try forking and updating those dependencies. If you get a functioning build with the latest next.js and webpack (or close to a functioning build), I'd be happy to review a pull request with any changes!

I opened a PR with a functioning webpack config :)

elastic / next-eui-starter

Incompatible with Nextjs 5 #37