I want to create a library using Typescript. This library can be used inside Node and browser environments, so the configuration supplies support for both
( tsconfig.json )
{
"compilerOptions": {
"baseUrl": ".",
"declaration": true,
"esModuleInterop": true,
"lib": [ "esnext", "dom" ],
"module": "commonjs",
"outDir": "dist",
"resolveJsonModule": true,
"strict": true,
"target": "es2019",
},
"include": [
"./**/*.ts"
],
"exclude": [
"./dist"
]
}
I'm using esbuild as a bundler. The package.json contains
{
"name": "my-lib",
"version": "1.0.0",
"main": "dist/index.js",
"types": "dist/index.d.ts",
"scripts": {
"build": "tsc && esbuild ./dist/index.js --bundle --minify --sourcemap --outfile=./bundle/index.js"
},
"dependencies": {
"esbuild": "0.14.36"
},
"devDependencies": {
"typescript": "4.6.3"
}
}
The library makes use of some "private" helper functions, I'm using the following sample code
import { TextEncoder } from 'util';
const encodeInput = function (input: string): Uint8Array {
const textEncoder = new TextEncoder();
return textEncoder.encode(input);
}
Running the build script command throws an esbuild error telling me that this only works for Node environments, not in the browser, which makes sense because
util package https://nodejs.org/api/util.html#class-utiltextencoderHow can I make sure this library works in "both" worlds?
TextEncoder is a global in Node, so you don't need to import it. Use it directly, without the import statement, just like in the browser.
You also don't need to instantiate a new
TextEncoderevery time the function is invoked: it is a small performance optimization to instantiate it once, and then just alias theencodemethod. See below.
const encoder = new TextEncoder();
const encode = encoder.encode.bind(encoder);
console.log(encode('hello world'));You can make use of the UMD (Universal Module Definition) tool to get around this problem.
In your tsconfig.json, just change module: "commonjs", to module: "umd", and it should build properly from there to work in all environments.