TypeStrong / ts-loader

TypeScript loader for webpack
https://johnnyreilly.com/ts-loader-goes-webpack-5
MIT License
3.45k stars 428 forks source link

ts-loader refuses to load module #1622

Closed obfuscatedgenerated closed 1 year ago

obfuscatedgenerated commented 1 year ago

Expected Behaviour

An external written in Typescript can be used.

Actual Behaviour

Webpack halts loading the external when encountering a type annotation or TS keyword with the error:

Module parse failed: Unexpected token (4:12)
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

Steps to Reproduce the Problem

Sample ts file from external named ollieos:

import { IDisposable, ITerminalOptions, Terminal } from "xterm";

import { ProgramRegistry } from "./prog_registry";
import type { AbstractFileSystem } from "./filesystem";

import type { KeyEvent, KeyEventHandler, RegisteredKeyEventIdentifier, SyncProgram, AsyncProgram } from "./types";
import { register_builtin_key_handlers, change_prompt as change_prompt, register_builtin_fs_handlers } from "./event_handlers";
import { SoundRegistry } from "./sfx_registry";

Excerpt of webpack.config.js:

module: {
            rules: [
                {
                    test: /\.tsx?$/,
                    use: "ts-loader",
                    exclude: /node_modules/,
                },
            ],
        },
        resolve: {
            extensions: [".ts", ".js"],
        },
        output: {
            filename: `./${version}/${name}-[name]-${version}.js`,
            sourceMapFilename: `../maps/${name}-[name]-${version}.js.map`,
            path: path.resolve(__dirname, "dist"),
            library: {
                type: "module",
            }
        },
        externals: {
            ollieos: "ollieos",
        },
        experiments: {
            outputModule: true,
        },

Error:

ERROR in ./node_modules/ollieos/src/term_ctl.ts 4:12
Module parse failed: Unexpected token (4:12)
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
|
| import { ProgramRegistry } from "./prog_registry";
> import type { AbstractFileSystem } from "./filesystem";
|
| import type { KeyEvent, KeyEventHandler, RegisteredKeyEventIdentifier, SyncProgram, AsyncProgram } from "./types";
 @ ./src/py/index.ts 1:0-44 9:35-39
obfuscatedgenerated commented 1 year ago

Note: it only occurs when the code being bundled uses the file containing these type annotations/keywords. If only parts of the external are used that could be interpreted as JS, the build passes.

obfuscatedgenerated commented 1 year ago

Removing the module as an external doesn't fix the issue, so it is clear ts-loader won't handle the file at all

obfuscatedgenerated commented 1 year ago

Nevermind, just realised I'm excluding node_modules haha 🙄