角度 5 项目中的错误“未定义 ace”答案

【问题标题】：error "ace is not defined" in angular 5 project角度 5 项目中的错误“未定义 ace”
【发布时间】：2018-04-12 21:10:36
【问题描述】：

我是开发 angular2+ 和 ace 的新手。当我将 ace 编辑器嵌入到我的 Angular 应用程序中时，我遇到了“未定义 ace”的错误。

我使用的系统是ubuntu gnome 16.04 我实施的步骤是： 1.使用 npm 安装 ace-builds 2.将node-module的路径复制到angular-cli.json（最重要的是，src-min-noconflict的ace.js。 3.构建一个编辑器组件，editor.component.ts中的代码是这样的：

declare const ace:any;

@Component({....})
export class EditorComponent implements OnInit {
    editor:any;
    ......

    ngOnInit() {
        this.editor = ace.edit("editor");
    }
}

控制台显示错误是在“this.editor =.....”行中引发的

我一直在尝试其他一些最新版本的 ace，但没有成功。有没有人有关于如何解决它的想法？我将非常感谢您的帮助！

【问题讨论】：

感觉ace js文件没有加载。你检查过捆绑的 js 文件是否包含它们？
@DanielWSrimpel 嗨，Daniel，您能帮忙说明您指的是哪些捆绑的 js 文件吗？我检查了 ace.js 是否在 ace-builds 的子目录中。并且路径应该是正确的（因为当它出错时，我无法构建项目）

标签： typescript ubuntu angular5 ace-editor

【解决方案1】：

ace 没有定义

可以通过在组件中导入 ace 插件文件来避免错误。

import ace from 'ace-builds/src-min-noconflict/ace';
import "brace/mode/{mode_name}";
import "brace/snippets/{mode_name}";
import "brace/ext/language_tools";

【讨论】：