模块解析失败 - Webpack Angular/cli 和 xtermjs答案

【问题标题】：Module parse failed - Webpack Angular/cli and xtermjs模块解析失败 - Webpack Angular/cli 和 xtermjs
【发布时间】：2018-01-17 17:02:11
【问题描述】：

目前我正在使用来自 angular cli 的 webpack 配置，并且面临相同的 .map 解析器问题。解析地图或插件加载器问题的任何解决方法？ ES5 代码工作正常，这是 ES6 systemjs 的问题

WARNING in ./node_modules/xterm/lib/addons/search/search.js.map
Module parse failed: /home/jack/Projects/C290/website/node_modules/source-map-loader/index.js

无法侵入 webconfig。删除 .map 文件没有帮助

更新：

import { Terminal } from 'xterm';

@Component({...})
export class AppComponent{
    xterm;
    constructor(){

      // Following line or not - it breaks with search.js.map
      //Terminal.loadAddon('search');

      // The following code when run breaks with the error
      this.xterm = new Terminal();
    }
}

这是实际问题，但 cli webpack 配置更改适用于何处？ https://github.com/sourcelair/xterm.js/issues/1018

https://github.com/sourcelair/xterm.js/issues/877

【问题讨论】：

你有什么简约的例子可以分享吗？
它是一个大应用程序。可能无法把所有的代码。但我更新了实际的破坏代码。
你用的是哪个ts加载器？
我不确定我是否理解？我正在使用 cli 1.4.2。这些是源映射加载器。 "source-map-loader": "^0.2.0", "source-map-support": "^0.4.1"
@pixelbits 好的，现在我有了正确的加载器。我现在正在使用commonjs。一个快速的问题 - Octal literal in strict mode (19:32) You may need an appropriate loader to handle this file type. 正在发生。文字是\033[1;3;31。正确理解这些 `\` 字符的适当加载程序是什么？它适用于普通文本。知道所需的装载机吗？

标签： angular parsing webpack xtermjs

【解决方案1】：

这个问题应该在 3.0.0 版本之后在 xterm.js 中修复。

以下步骤应该有助于解决您的问题：

获取最新版本：https://github.com/xtermjs/xterm.js/releases/tag/3.0.2
将loadAddon 替换为new API for using addons（手动导入和applyAddon）

您可以在https://github.com/parisk/xterm-webpack 看到一个关于其工作原理的最小示例。

【讨论】：

是的，已经获得了 3x 版本。尽管调整大小的一些问题似乎没有得到解决。让我再检查一下。