🧩 Plasmo Developers•16mo ago

How do I use `tslog` (esm)

I honestly don't understand es modules that well. I know how it's intded to work but never really understood the interop modes with typescript and other bundlers. I'm trying to use tslog which is exported as an es moudle but when I do a standard import and try to use it, I get logger.ts:6 Uncaught TypeError: _tslog.Logger is not a constructor. Any ideas on what I should be doing?

10 Replies

nahtnamOP•16mo ago

Just doing

import { ILogObj, Logger } from 'tslog';

export const log: Logger<ILogObj> = new Logger({
  type: 'pretty',
});

import { ILogObj, Logger } from 'tslog';

export const log: Logger<ILogObj> = new Logger({
  type: 'pretty',
});

also tried import * as tslog from 'tslog' Some ESM stuff is happening, heres the full trace

logger.ts:6 Uncaught TypeError: (0 , _tslog.Logger) is not a constructor
    at 337kL.@parcel/transformer-js/src/esmodule-helpers.js (logger.ts:6:9)
    at newRequire (newtab.7ee8b14b.js:72:24)
    at localRequire (newtab.7ee8b14b.js:85:35)
    at b1OBE.@sentry/react (useUser.tsx:7:1)
    at newRequire (newtab.7ee8b14b.js:72:24)
    at localRequire (newtab.7ee8b14b.js:85:35)
    at 1Iqrd.immer (useDemoStore.ts:14:7)
    at newRequire (newtab.7ee8b14b.js:72:24)
    at localRequire (newtab.7ee8b14b.js:85:35)
    at f0VUA.react/jsx-dev-runtime (DemoProvider.tsx:3:1)

logger.ts:6 Uncaught TypeError: (0 , _tslog.Logger) is not a constructor
    at 337kL.@parcel/transformer-js/src/esmodule-helpers.js (logger.ts:6:9)
    at newRequire (newtab.7ee8b14b.js:72:24)
    at localRequire (newtab.7ee8b14b.js:85:35)
    at b1OBE.@sentry/react (useUser.tsx:7:1)
    at newRequire (newtab.7ee8b14b.js:72:24)
    at localRequire (newtab.7ee8b14b.js:85:35)
    at 1Iqrd.immer (useDemoStore.ts:14:7)
    at newRequire (newtab.7ee8b14b.js:72:24)
    at localRequire (newtab.7ee8b14b.js:85:35)
    at f0VUA.react/jsx-dev-runtime (DemoProvider.tsx:3:1)

lab•16mo ago

Is tslog's package.json a proper ESM module? (i.e parsable by the native node resolver) Otherwise, if it's relying on webpack fallback (like a hybrid), we would need to add it into the ESM resolver list, or we need to create a new configuration feature for ppl to pass down these ESM modules.... Since there're modules that is compiled as ESM, but they didnt' fix their package.json to denote they are ESM...

nahtnamOP•16mo ago

I do see "type": "module", when I look through my node_modules https://github.com/fullstack-build/tslog/blob/master/package.json#L16

lab•16mo ago

I misread the err you got - it's a runtime err

nahtnamOP•16mo ago

Yep, im honestly not even sure what to do to debug

lab•16mo ago

try doing this:

import tslog from 'tslog'

console.log(tslog)

import tslog from 'tslog'

console.log(tslog)

nahtnamOP•16mo ago

nahtnamOP•16mo ago

Empty object

nahtnamOP•16mo ago

https://github.com/fullstack-build/tslog/issues/239

GitHub

Usage with parcel? · Issue #239 · fullstack-build/tslog

Hello, I get the error @parcel/core: node_modules/tslog/dist/browser/index.js does not export 'Logger' when building a bare parcel webextension project at the latest versions. Here is a rep...

nahtnamOP•16mo ago

Plasmo uses parcel right? Adding

"@parcel/resolver-default": {
    "packageExports": true
  }

"@parcel/resolver-default": {
    "packageExports": true
  }

to my package.json worked I looked through the open issues but not the closed one, my bad!

Gaming

Programming

How do I use `tslog` (esm)