Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to add custom ace configuration? #6

Open
SparkFountain opened this issue Jun 20, 2019 · 4 comments
Open

How to add custom ace configuration? #6

SparkFountain opened this issue Jun 20, 2019 · 4 comments
Labels

Comments

@SparkFountain
Copy link

Is there a way to define custom paths for themes and modes? I know that with the original Ace library, you can just access the property ace.config to overwrite path properties like basePath, themePath and modePath. Unfortunately, it seems to be impossible to access or overwrite the config property of the Ace instance; even though the ngx-ace-wrapper documentation says it would allow for full API access through the ace() method on the directive reference.

Please tell me if I overlooked something or whether it is possible to change i. e. the modePath at all. Right now, I can only achieve this by editing the index.js file of ngx-ace-wrapper (relevant lines are 4082 - 4090) but I would like to avoid changing dependency files...

Thank you for your help!

@sconix
Copy link
Contributor

sconix commented Jun 20, 2019

Not sure for what you need that. Its more of an question how to do that with Brace. Due to way the Brace works you just import the modes and themes in your code and after that it works. Just see the code for an example.

@oleg-tsybulsky
Copy link

I join the question. I need to dynamically update the mode as the syntax may change.

@sconix
Copy link
Contributor

sconix commented Oct 7, 2019

Example app has mode switching function so check that for how to change mode.

@smileLilith
Copy link

What worked for me was

import * as ace from 'ace-builds';

constructor(private zone: NgZone, @Inject(ENV_ADMIN_BASE_TOKEN) private adminBase: string) {
    const assetsPath: string = `${this.adminBase}/assets/ace`; // Path is set in angular.json `assets` output
    this.zone.runOutsideAngular(() => {
      ace.config.set('basePath', assetsPath);
      ace.config.set('modePath', assetsPath);
      ace.config.set('themePath', assetsPath);
      ace.config.set('workerPath', assetsPath);
    });
  }

and in angular.json

"architect": {
        "build": {
          "options": {
            "assets": [
              "src/assets",
              {
                "glob": "@(mode-*)",
                "input": "node_modules/ace-builds/src-min-noconflict",
                "output": "/assets/ace/"
              },
              {
                "glob": "@(ext-modelist|ext-searchbox|theme-eclipse|worker-javascript).js",
                "input": "node_modules/ace-builds/src-min-noconflict",
                "output": "/assets/ace/"
              }
            ],
          }
        }
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants