# Webpack fails with Next.js 14.1.0

**URL:** <https://forum.builder.io/t/webpack-fails-with-next-js-14-1-0/4882>\
**Category:** Technical Questions\
**Tags:** nextjs\
**Created:** [January 29, 2024, 3:54am UTC](https://forum.builder.io/t/webpack-fails-with-next-js-14-1-0/4882 "2024-01-29T03:54:02Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![behivetech](https://avatars.discourse-cdn.com/v4/letter/b/bb73d2/32.png) [@behivetech](https://forum.builder.io/u/behivetech)\
**Post date:** [January 29, 2024, 3:54am UTC](https://forum.builder.io/t/webpack-fails-with-next-js-14-1-0/4882/1 "2024-01-29T03:54:02Z")

</div>

_Please fill out as many of the following questions as possible so we can help you promptly! If you don’t know how to answer or it does not apply, feel free to remove it or leave it blank._

**Builder public api key**  
a2741df076364e6295b8b3210e1bd0cb

**What are you trying to accomplish**  
User builder, but can’t even get it to work.

**Screenshots or video link**

**Code stack you are integrating Builder with**  
NextJS 14.1.0

**Reproducible code example**  
I’m just trying to add the line `builder.init("a2741df076364e6295b8b3210e1bd0cb")`. As soon as I use anything from the `"@builder.io/react": "^3.2.0"` package (installed latest), it breaks.

My next.config.js looks like this…

```auto
const withBuilderDevTools = require("@builder.io/dev-tools/next")();
const path = require("path");

module.exports = withBuilderDevTools({
  sassOptions: {
    includePaths: [path.join(__dirname, "src/styles")],
  },
});

```

It returns a fairly large error, but this is the first part that shows up in the browser…

```auto
Server Error
Error: (0 , react __WEBPACK_IMPORTED_MODULE_1__.createContext) is not a function

This error happened while generating the page. Any console logs will be displayed in the terminal window.
Call Stack
eval
node_modules/@emotion/core/dist/emotion-element-39b82f0b.esm.js (11:0)
(rsc)/./node_modules/@emotion/core/dist/emotion-element-39b82f0b.esm.js
file:///Users/jbsmith/Projects/rainbowportalshop/.next/server/vendor-chunks/@emotion.js (40:1)
__webpack_require__
file:///Users/jbsmith/Projects/rainbowportalshop/.next/server/webpack-runtime.js (33:42)
eval
webpack-internal:///(rsc)/./node_modules/@emotion/core/dist/core.esm.js (17:90)
(rsc)/./node_modules/@emotion/core/dist/core.esm.js

```

The console running the server shows this…

```auto
 ⨯ node_modules/@emotion/core/dist/emotion-element-39b82f0b.esm.js (11:0) @ eval
 ⨯ TypeError: (0 , react __WEBPACK_IMPORTED_MODULE_1__.createContext) is not a function
    at __webpack_require__ (/Users/jbsmith/Projects/rainbowportalshop/.next/server/webpack-runtime.js:33:42)
    at __webpack_require__ (/Users/jbsmith/Projects/rainbowportalshop/.next/server/webpack-runtime.js:33:42)
    at __webpack_require__ (/Users/jbsmith/Projects/rainbowportalshop/.next/server/webpack-runtime.js:33:42)
    at eval (./src/app/page.tsx:10:75)
    at (rsc)/./src/app/page.tsx (/Users/jbsmith/Projects/rainbowportalshop/.next/server/app/page.js:279:1)
    at Function. __webpack_require__ (/Users/jbsmith/Projects/rainbowportalshop/.next/server/webpack-runtime.js:33:42)
    at async Promise.all (index 0)
null

```

---

<div class="post-metadata">

**Author:** ![chtbks-jason](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/chtbks-jason/32/2242_2.png) [@chtbks-jason](https://forum.builder.io/u/chtbks-jason)\
**Post date:** [January 29, 2024, 10:21pm UTC](https://forum.builder.io/t/webpack-fails-with-next-js-14-1-0/4882/2 "2024-01-29T22:21:42Z")

</div>

That _looks_ to be a bug related to Emotion, rather than Builder. I believe Emotion recently updated their versions, so it could be an out of date dependency?

---

<div class="post-metadata">

**Author:** ![behivetech](https://avatars.discourse-cdn.com/v4/letter/b/bb73d2/32.png) [@behivetech](https://forum.builder.io/u/behivetech)\
**Post date:** [January 30, 2024, 12:22am UTC](https://forum.builder.io/t/webpack-fails-with-next-js-14-1-0/4882/3 "2024-01-30T00:22:28Z")

</div>

It looks like it goes beyond just an @emotion issue. Based on the above reply, I decided to remove my package-lock.json file and node\_modules folder and tried a new `npm install` because I know I don’t have anything in my repo that uses @emotion like an MUI component or anything like that. This is practically a brand new NextJS repo without any additional libraries added. The only things I’ve changed are some very simple components. I got an error on the install so I pulled out the [builder.io](http://builder.io) packages from the package.json…

```auto
"@builder.io/dev-tools": "^0.2.10",
"@builder.io/react": "^3.2.0",
"@builder.io/sdk": "^2.2.1",

```

Then tried to just install…

```auto
npm i @builder.io/react@latest

```

…and got this error using node v21.6.1 and npm 10.2.4

```auto
npm ERR! code 1
npm ERR! path /Users/myusername/Projects/myproject/node_modules/isolated-vm
npm ERR! command failed
npm ERR! command sh -c prebuild-install || (node-gyp rebuild --release -j max && node-gyp clean)
npm ERR! prebuild-install warn install No prebuilt binaries found (target=21.6.1 runtime=node arch=x64 libc= platform=darwin)
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp info using node-gyp@10.0.1
npm ERR! gyp info using node@21.6.1 | darwin | x64
npm ERR! gyp info find Python using Python version 3.9.10 found at "/usr/local/opt/python@3.9/bin/python3.9"
npm ERR! gyp info spawn /usr/local/opt/python@3.9/bin/python3.9
npm ERR! gyp info spawn args [
npm ERR! gyp info spawn args '/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/gyp_main.py',
npm ERR! gyp info spawn args 'binding.gyp',
npm ERR! gyp info spawn args '-f',
npm ERR! gyp info spawn args 'make',
npm ERR! gyp info spawn args '-I',
npm ERR! gyp info spawn args '/Users/myusername/Projects/myproject/node_modules/isolated-vm/build/config.gypi',
npm ERR! gyp info spawn args '-I',
npm ERR! gyp info spawn args '/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/addon.gypi',
npm ERR! gyp info spawn args '-I',
npm ERR! gyp info spawn args '/Users/myusername/Library/Caches/node-gyp/21.6.1/include/node/common.gypi',
npm ERR! gyp info spawn args '-Dlibrary=shared_library',
npm ERR! gyp info spawn args '-Dvisibility=default',
npm ERR! gyp info spawn args '-Dnode_root_dir=/Users/myusername/Library/Caches/node-gyp/21.6.1',
npm ERR! gyp info spawn args '-Dnode_gyp_dir=/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp',
npm ERR! gyp info spawn args '-Dnode_lib_file=/Users/myusername/Library/Caches/node-gyp/21.6.1/<(target_arch)/node.lib',
npm ERR! gyp info spawn args '-Dmodule_root_dir=/Users/myusername/Projects/myproject/node_modules/isolated-vm',
npm ERR! gyp info spawn args '-Dnode_engine=v8',
npm ERR! gyp info spawn args '--depth=.',
npm ERR! gyp info spawn args '--no-parallel',
npm ERR! gyp info spawn args '--generator-output',
npm ERR! gyp info spawn args 'build',
npm ERR! gyp info spawn args '-Goutput_dir=.'
npm ERR! gyp info spawn args ]
npm ERR! No receipt for 'com.apple.pkg.CLTools_Executables' found at '/'.
npm ERR! 
npm ERR! No receipt for 'com.apple.pkg.DeveloperToolsCLILeo' found at '/'.
npm ERR! 
npm ERR! No receipt for 'com.apple.pkg.DeveloperToolsCLI' found at '/'.
npm ERR! 
npm ERR! Traceback (most recent call last):
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/xcode_emulation.py", line 1496, in XcodeVersion
npm ERR! version_list = GetStdoutQuiet(["xcodebuild", "-version"]).splitlines()
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/xcode_emulation.py", line 1557, in GetStdoutQuiet
npm ERR! raise GypError("Error %d running %s" % (job.returncode, cmdlist[0]))
npm ERR! gyp.common.GypError: Error 1 running xcodebuild
npm ERR! 
npm ERR! During handling of the above exception, another exception occurred:
npm ERR! 
npm ERR! Traceback (most recent call last):
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/gyp_main.py", line 45, in <module>
npm ERR! sys.exit(gyp.script_main())
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/ __init__.py", line 688, in script_main
npm ERR! return main(sys.argv[1:])
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/ __init__.py", line 680, in main
npm ERR! return gyp_main(args)
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/ __init__.py", line 665, in gyp_main
npm ERR! generator.GenerateOutput(flat_list, targets, data, params)
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/generator/make.py", line 2648, in GenerateOutput
npm ERR! writer.Write(
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/generator/make.py", line 912, in Write
npm ERR! self.WriteSources(
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/generator/make.py", line 1395, in WriteSources
npm ERR! cflags = self.xcode_settings.GetCflags(
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/xcode_emulation.py", line 662, in GetCflags
npm ERR! archs = self.GetActiveArchs(self.configname)
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/xcode_emulation.py", line 512, in GetActiveArchs
npm ERR! xcode_archs_default = GetXcodeArchsDefault()
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/xcode_emulation.py", line 119, in GetXcodeArchsDefault
npm ERR! xcode_version, _ = XcodeVersion()
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/xcode_emulation.py", line 1507, in XcodeVersion
npm ERR! version = CLTVersion() # macOS Catalina returns 11.0.0.0.1.1567737322
npm ERR! File "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/gyp/pylib/gyp/xcode_emulation.py", line 1545, in CLTVersion
npm ERR! return re.search(regex, output).groupdict()["version"]
npm ERR! AttributeError: 'NoneType' object has no attribute 'groupdict'
npm ERR! gyp ERR! configure error 
npm ERR! gyp ERR! stack Error: `gyp` failed with exit code: 1
npm ERR! gyp ERR! stack at ChildProcess.<anonymous> (/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:271:18)
npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:519:28)
npm ERR! gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:294:12)
npm ERR! gyp ERR! System Darwin 23.2.0
npm ERR! gyp ERR! command "/Users/myusername/.nvm/versions/node/v21.6.1/bin/node" "/Users/myusername/.nvm/versions/node/v21.6.1/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--release" "-j" "max"
npm ERR! gyp ERR! cwd /Users/myusername/Projects/myproject/node_modules/isolated-vm
npm ERR! gyp ERR! node -v v21.6.1
npm ERR! gyp ERR! node-gyp -v v10.0.1
npm ERR! gyp ERR! not ok

```

So at this point I can’t even use [builder.io](http://builder.io) components or utils. Sadly, I will probably have to go with a headless CMS. I was hoping to knock something out really quick with builder.

---

<div class="post-metadata">

**Author:** ![chtbks-jason](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/chtbks-jason/32/2242_2.png) [@chtbks-jason](https://forum.builder.io/u/chtbks-jason)\
**Post date:** [January 30, 2024, 6:07pm UTC](https://forum.builder.io/t/webpack-fails-with-next-js-14-1-0/4882/4 "2024-01-30T18:07:19Z")

</div>

Apparently, there’s a known issue with `isolated-vm` right now.

> [@Error: Cannot find module 'isolated-vm'](https://forum.builder.io/t/error-cannot-find-module-isolated-vm/4884):
>
> nextjs: 13.4.3 @builder.io/sdk-react：0.12.3 deploy node version: 18(local 21) use pnpm，monorepo An error occurs during deployment Error: Cannot find module 'isolated-vm' But I can deploy normally using version 0.8.0（@builder.io/sdk-react）

---

<div class="post-metadata">

**Author:** ![anon43891756](https://avatars.discourse-cdn.com/v4/letter/a/50afbb/32.png) [@anon43891756](https://forum.builder.io/u/anon43891756)\
**Post date:** [February 8, 2024, 12:54pm UTC](https://forum.builder.io/t/webpack-fails-with-next-js-14-1-0/4882/5 "2024-02-08T12:54:53Z")

</div>

Hi @behivetech, Welcome to the [Builder.io](http://Builder.io) Forum!

We have deployed a possible fix for this issue, please verify and let us know if you still have any concerns.
