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.

Vite and rollup browser error when importing library

See original GitHub issue

I’m getting what looks like the symptom of a circular dependency when loading the ESM module in a browser.

Expected Behavior

Running the following code should import the ES module and not throw an error.

import * as filestack from "filestack-js";

Current Behavior

Running the following code:

import * as filestack from "filestack-js";

Raises the following error in the browser console:

Uncaught TypeError: Object prototype may only be an Object or null: undefined
    at setPrototypeOf (<anonymous>)
    at __extends (tslib.es6.js:25)
    at http.ts:43
    at node_modules/filestack-js/build/module/lib/request/adapters/http.js (http.ts:64)
    at __init (filestack-js.js?v=7b23504f:14)
    at request_adapter.node.ts:17

The problem is the usage of Stream.Writable when defining a class in http.ts. Stream.Writable is undefined. This would appear to be due to a circular dependency that rollup cannot resolve, but I’m not really sure.

Steps to Reproduce (for bugs)

Reproduction repo is https://github.com/taylorthurlow/filestack-rollup-repro - simple instructions can be found in the README. You will need ruby installed, I used Ruby 2.7. 2.5 and 2.6 should also be fine. This repo is basically a completely unmodified Rails application. The commit history is extremely short and shows what little I need to do to get this to happen.

Additional Screenshots

Screen Shot 2021-08-26 at 5 57 28 PM

Context

I’m just trying to use the library with Vite, which uses rollup under the hood.

Your Environment

  • Version used: 3.24.1
  • Browser Name and version: Chrome 92 and Firefox 90.
  • Operating System and version (desktop or mobile): macOS 11.5.2

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:9

github_iconTop GitHub Comments

13reactions
paultuckeycommented, Sep 26, 2021

@taylorthurlow I was able to work around this same issue by importing the built esm directly:

import * as filestack from 'filestack-js/build/browser/filestack.esm';
0reactions
tcampbPPUcommented, Jul 12, 2022

@taylorthurlow I was able to work around this same issue by importing the built esm directly:

import * as filestack from 'filestack-js/build/browser/filestack.esm';

Thanks! The fix I was looking for

Read more comments on GitHub >

github_iconTop Results From Across the Web

Rollup code-split error during lib build · Issue #9310 · vitejs/vite
As soon as a dynamic import is introduced, the ESM build fails to compile: $ vite build vite v3.0.2 building for production.
Read more >
Troubleshooting - Vite
Syntax Error / Type Error happens​​ Vite cannot handle and does not support code that only runs on non-strict mode (sloppy mode). This...
Read more >
Error migrating library from rollup to vitejs - Stack Overflow
Vitejs config. When I switch to using vitejs, this is the vite config: // vite.config.js for components import ...
Read more >
__vite-browser-external | The AI Search Engine You Control
ERROR 'dirname' is not exported by __vite-browser-external, imported by ... This Rollup aliases are extracted from @esbuild-plugins/node-modules-polyfill, ...
Read more >
Index Vite App - GitHub Pages
// rollup.config.js /** * @type {import('rollup').RollupOptions} */ const config = { /* your config */ }; export default config;.
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