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.

Module parse failed on tiff/lib-esm/tiffDecoder.js

See original GitHub issue

Hello,

I am trying to use image-js with ESM from an Angular application. I get the following error:

ERROR in ../node_modules/tiff/lib-esm/tiffDecoder.js 13:12
2021-10-11T22:10:54.877685815Z Module parse failed: Unexpected token (13:12)
2021-10-11T22:10:54.877688343Z You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
2021-10-11T22:10:54.877690795Z | };
2021-10-11T22:10:54.877693407Z | export default class TIFFDecoder extends IOBuffer {
2021-10-11T22:10:54.877695648Z >     _nextIFD;
2021-10-11T22:10:54.877697974Z |     constructor(data) {
2021-10-11T22:10:54.877700254Z |         super(data);

If I take a look at tiff/lib-esm/tiffDecoder.js, I see:

import { decompressZlib } from './zlib';
const defaultOptions = {
    ignoreImageData: false,
    onlyFirst: false,
};
export default class TIFFDecoder extends IOBuffer {
    _nextIFD;
    constructor(data) {
        super(data);
        this._nextIFD = 0;
    }
//...

_nextIFD declaration is not supported by the bundler.

This is the config used by tiff library:

rhousni@rhousni:~/projects/tiff$ tsc --showConfig --project tsconfig.esm.json
{
    "compilerOptions": {
        "esModuleInterop": true,
        "moduleResolution": "node",
        "sourceMap": true,
        "strict": true,
        "target": "esnext",
        "module": "es6",
        "outDir": "./lib-esm",
        "declaration": false
    },
    "files": [
        "./src/horizontalDifferencing.ts",
        "./src/ifd.ts",
        "./src/ifdValue.ts",
        "./src/index.ts",
        "./src/lzw.ts",
        "./src/tiffDecoder.ts",
        "./src/tiffIfd.ts",
        "./src/types.ts",
        "./src/zlib.ts",
        "./src/tags/exif.ts",
        "./src/tags/gps.ts",
        "./src/tags/standard.ts"
    ],
    "include": [
        "./src/**/*"
    ],
    "exclude": [
        "./src/**/__tests__"
    ]
}

So I guess JS class variable declaration is only supported in a future ECMAScript version.

Changing the TS target to es2017 fixes the issue. Would you accept a PR for this?