Ace在線編輯器使用requirejs配置


  1. Ace代碼在線編輯器如果需要在requirejs里使用,注意需要使用github上lib/ace目錄的文件。
  2. 如果使用ajaxorg/ace-builds下面的代碼再使用requirejs會報錯,不能正常使用。
  3. 關於requirejs的配置:

將github上lib/ace下的所有文件下載到自己的項目下。

然后在require.config里配置,如下:

require.config({
  // 根路徑設置,paths下面全部都是根據baseUrl的路徑去設置
  baseUrl:'/lib/js/',
  paths:{
    // 引入jQuery
    jquery: 'jquery.2.0.0.min',
    bootstrap: 'bootstrap/js/bootstrap.min.js',
    ace: 'ace',
  },
})

這里的ace配置的是ace目錄,而ace.js和其他ace插件js都在ace目錄下方,所以在js文件里require()的時候,需要在引入依賴的require模塊時還要加上ace下面的具體js文件,比如:

require(['jquery', 'ace/ace', 'ace/ext/language_tools'], function ($, http, ace) {
  console.log(ace)
  var editor = ace.edit("line-value",{theme: "ace/theme/monokai",});
  ace.require('ace/ext/language_tools');
  editor.getSession().setMode('ace/mode/javascript');
  editor.setOptions({
    enableBasicAutocompletion: true,
    enableSnippets: true,
    enableLiveAutocompletion: true
  });
})

其中'ace/ace'和'ace/ext/language_tools'是ace目錄下的ace.js和ace/ext目錄下的language_tools插件,使用ace插件只需要在依賴引入后直接使用,不用在回調函數里定義對應的變量,定義對應變量再使用會報錯。

可以看github上的demo modelist


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM