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.

Library stop working after webpack bundle it

See original GitHub issue

Issue Description

The library works fine in dev mode in my vue app but will stop working when webpack minify the files to create the dist bundle. To make things working again I’ve added this line chainWebpack: config => config.optimization.minimize(false) to my vue.config.js file, it will disable files minification but will result in worst performances in case of large app. This is the error that is logged in console after the production build of the app is created and the user try to create a zip file

Uncaught TypeError: Cannot read property 'length' of null
    at A (chunk-vendors.64883a9e.js:6)
    at chunk-vendors.64883a9e.js:6
    at Worker.s.onerror (chunk-vendors.64883a9e.js:6)
A @ chunk-vendors.64883a9e.js:6
(anonymous) @ chunk-vendors.64883a9e.js:6
s.onerror @ chunk-vendors.64883a9e.js:6
error (async)
r @ chunk-vendors.64883a9e.js:6
X @ chunk-vendors.64883a9e.js:6
re @ chunk-vendors.64883a9e.js:6
ce @ chunk-vendors.64883a9e.js:6
h @ chunk-vendors.64883a9e.js:6
Ae @ chunk-vendors.64883a9e.js:6
(anonymous) @ write-zip.896bce5d.js:1
u @ chunk-vendors.64883a9e.js:8
(anonymous) @ chunk-vendors.64883a9e.js:8
(anonymous) @ chunk-vendors.64883a9e.js:8
a @ chunk-vendors.64883a9e.js:1
s @ chunk-vendors.64883a9e.js:1
Promise.then (async)
a @ chunk-vendors.64883a9e.js:1
s @ chunk-vendors.64883a9e.js:1
Promise.then (async)
a @ chunk-vendors.64883a9e.js:1
s @ chunk-vendors.64883a9e.js:1
Promise.then (async)
a @ chunk-vendors.64883a9e.js:1
s @ chunk-vendors.64883a9e.js:1
Promise.then (async)
a @ chunk-vendors.64883a9e.js:1
s @ chunk-vendors.64883a9e.js:1
Promise.then (async)
a @ chunk-vendors.64883a9e.js:1
s @ chunk-vendors.64883a9e.js:1
Promise.then (async)
a @ chunk-vendors.64883a9e.js:1
s @ chunk-vendors.64883a9e.js:1
Promise.then (async)
a @ chunk-vendors.64883a9e.js:1
s @ chunk-vendors.64883a9e.js:1
Promise.then (async)
a @ chunk-vendors.64883a9e.js:1
s @ chunk-vendors.64883a9e.js:1
Promise.then (async)
a @ chunk-vendors.64883a9e.js:1
s @ chunk-vendors.64883a9e.js:1
(anonymous) @ chunk-vendors.64883a9e.js:1
(anonymous) @ chunk-vendors.64883a9e.js:1
processFiles @ write-zip.896bce5d.js:1
(anonymous) @ write-zip.896bce5d.js:1
(anonymous) @ chunk-vendors.64883a9e.js:6
Ee @ chunk-vendors.64883a9e.js:6
Re @ chunk-vendors.64883a9e.js:6
t @ chunk-vendors.64883a9e.js:6

Issue Analytics

State:
Created 2 years ago
Comments:27 (14 by maintainers)

Top GitHub Comments

2reactions

101arrowzcommented, Dec 31, 2020

Check v0.4.8 on NPM, which should have fixed the issue for your Chrome extension. Thanks for the bug report and especially for your continued help in debugging!

1reaction

realrecordzLabcommented, Jan 1, 2021

The problem was with the library, not your code, although you did have an unusual use case. The Content Security Policy (CSP) is used to prevent arbitrary code injection and execution from untrusted sources, which can somewhat improve security. Most of the time, I test with a very loose Content Security Policy, which is the default for most environments. However, Chrome extensions are not really allowed to execute anything but their own code, so I had to rewrite one function that used dynamic evaluation to make everything work. I hope the library works well for your codebase!

Not so unusual to see a strict CSP on certain websites nowdays, the update to support CSP is a great think trust me. I will link to the extension repo in my app where this project is used. You did a great job. Thank you!

Top Results From Across the Web

Webpack bundled library does not compile in React

I'm trying to bundle a standalone library with Webpack (v5) and use it in my React application. The webpack.config.js file is pretty ...

Configuring library as external in webpack does not work like ...

I have a custom umd library (mylib) made by myself (bundled with webpack, of course); when I try to consume it in my...

Authoring Libraries | webpack

The following guide is meant for library authors looking to streamline their ... Now webpack will bundle a library that can work with...

Externals - webpack

The externals configuration option provides a way of excluding dependencies from the output bundles. Instead, the created bundle relies on that dependency ...

Output - webpack

When used in tandem with output.library and output. ... This bundle will not work as expected, or not work at all (in the...