question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Incompatability between plugin-webpack and NPM7

See original GitHub issue

Preflight Checklist

  • I have read the contribution documentation for this project.
  • I agree to follow the code of conduct that this project follows, as appropriate.
  • I have searched the issue tracker for a bug that matches the one I want to file, without success.

Issue Details

  • Electron Forge Version:
    • 6.0.0-beta.53
  • Electron Version:
    • 10.1.3
  • Operating System:
    • Mac OS 10.15.7
  • Last Known Working Electron Forge version::
    • n/a

Expected Behavior

The expected behavior is that electron-forge should work as-intended no matter the version of npm with which it is being executed.

Actual Behavior

Because of a change in how dependency resolution is processed as of npm@7 (recently released), electron-forge commands no longer run, at least for my project on my machine.

In these cases, the error reported here occurs - “TypeError: Cannot read property ‘createSnapshot’ of undefined”.

Digging into node_modules, I can confirm that there is a node_modules/webpack at version 5 and a /node_modules/@electron-forge/plugin-webpack/node_modules/webpack at version 4. This duplicate issue is almost surely what is causing the error.

Downgrading to npm@6 fixes the issue.

To Reproduce

  1. NPM is on a version greater than 7.0.0. In my case, 7.0.2.
  2. electron-forge is a local dev dependency to the project.
  3. Some mysterious condition I haven’t yet cornered…

I’m posting this before I’ve found exactly what is causing this issue on this one project, but which fails to reproduce on npm@6 or on a plain npx create-electron-app my-new-app --template=webpack. My hope is that someone else is running into this and has some of the data I am missing.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:9
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

4reactions
feljxcommented, Feb 19, 2021

Possibly related to this change in NPM?

Peer dependencies Automatically installing peer dependencies is an exciting new feature introduced in npm 7. In previous versions of npm (4-6), peer dependencies conflicts presented a warning that versions were not compatible, but would still install dependencies without an error. npm 7 will block installations if an upstream dependency conflict is present that cannot be automatically resolved.

As described, the issue is the webpack 4 dependency within the webpack plugin. Either upgrading to webpack 5 or declaring it as a peer dependency fixes the issue, not sure what the right course of action is since I don’t know my way around the codebase.

The bug occurs when using NPM 7 and generating a project with create-electron-app with the webpack (or typescript-webpack) template. To circumvent, switch to NPM 6 (latest node version would be 14.15.5) for generation, then switch back to NPM 7 and it’ll work fine (obviously you need a node version manager).

1reaction
maleptcommented, May 23, 2021

The Webpack plugin uses Webpack 5 as of beta 56.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Incompatability between plugin-webpack and NPM7 #1998
NPM is on a version greater than 7.0.0. In my case, 7.0.2. electron-forge is a local dev dependency to the project. Some mysterious...
Read more >
webpack-plugin-compat - npm
This plugin provides a compatibility api that can be used with all current versions of webpack.
Read more >
Webpack - npm
Renders Pug files to HTML, extracts JS and CSS from sources specified directly in Pug. Loaders. Webpack enables the use of loaders to...
Read more >
copy-webpack-plugin - npm
Copy files && directories with webpack. Latest version: 11.0.0, last published: 7 months ago. Start using copy-webpack-plugin in your ...
Read more >
This version has been deprecated - html-webpack-plugin - npm
html-webpack-plugin. TypeScript icon, indicating that this package has built-in type declarations. 4.0.0-beta.7 • Public • Published 3 years ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found