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.

Broken IE 11 loading because of wrong "main" value in package.json

See original GitHub issue

You want to:

  • report a bug
  • request a feature

Current behaviour

What is actually happening?

Following the official example of using:

import io from 'socket.io-client';

in a JS app results in a broken site in IE 11.

By broken I don’t mean the socket-io functionality doesn’t work, but that it breaks loading the whole web app’s bundle, including error reporting etc. Because no one tests on IE 11 probably no one really noticed this bug.

Steps to reproduce (if the current behaviour is a bug)

Just add import io from 'socket.io-client' in a web app and test in IE 11.

Expected behaviour

What is expected?

IE 11 should load the bundle

Setup

  • OS: Win 10
  • browser: IE 11
  • socket.io version:

Other information (e.g. stacktraces, related issues, suggestions how to fix)

The reason this is happening is because the “main” value in package.json specifies the unbundled source code, not the bundled dist folder, thus the source code gets bundled. Probably some bundlers also process the imported modules, but my version of Webpack doesn’t, it only processes user’s source code.

The solution would be very simple, to specify one of the dist files as the “main” value.

As a workaround I am using this line, which works:

import io from 'socket.io-client/dist/socket.io.slim.js'

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:9
  • Comments:6 (1 by maintainers)

github_iconTop GitHub Comments

3reactions
kandcommented, Feb 26, 2020

Workaround works for me as well, thanks!

0reactions
darrachequesnecommented, Sep 30, 2020

The debug dependency was reverted to 3.1.0, which does not need to be transpiled. Released in 2.3.1.

Please note that you can also use the webpack-remove-debug plugin, in order to remove any call to the debug dependency (until we find a proper way to provide a build with and without debug).

Read more comments on GitHub >

github_iconTop Results From Across the Web

Angular 2 / 4 / 5 not working in IE11 - Stack Overflow
I was asked in the comments by @jackOfAll whether IE11 polyfills are loaded even if the user is in an evergreen browser which...
Read more >
Common errors | npm Docs
It's most likely a temporary npm registry glitch. Check npm server status and try again later. If the error persists, perhaps the published...
Read more >
Fix web compatibility issues using document modes and the ...
The Internet Explorer 11 Enterprise Mode site list lets you specify document modes for specific websites, helping you fix compatibility ...
Read more >
Is your Vue app not working in IE 11? Here's how to fix it.
Why is this error happening? ... The main reason why your Vue app is breaking in IE11 is because the browser does not...
Read more >
Error Codes | Yarn - Package Manager
The author of packageA can fix this problem by adding a peer dependency on packagePeer . If relevant, they can use optional peer...
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