欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Arcgisjavascript:dojo中djconfig配置、dojo与requirejs项目冲突问题

程序员文章站 2023-11-23 14:38:40
一、引言 由于项目一部分使用requirejs另一部分地图是用dojo开发(因为arcgis javascript使用的dojo),两个要和到一起,所以要求研究下如何把两者和到一...

一、引言

由于项目一部分使用requirejs另一部分地图是用dojo开发(因为arcgis javascript使用的dojo),两个要和到一起,所以要求研究下如何把两者和到一起,花了两天时间看了看requirejs与dojo,终于搞定了。

二、amd标准下dojo与requirejs区别与联系

amd标准我就不说了,简单来讲这个就是类似java包import或者c#using,为了方便js管理与使用,不清楚的可以看下这个点击打开链接

一样的是dojo与requirejs都符合amd标准,所以define、require和初始化基本一样,依次类推其他符合amd的也应该通用;

不同的是dojo和requirejs都自己实现了amd标准,没有依赖关系,dojo早期版本没有实现amd的时候有人以requirejs为基础实现了amd标准,所以一直以为dojo底层使用的是requirejs,但是我把dojo翻了翻没有找到requirejs,所以现在两者代码没有任何关联。

三、dojo与requirejs项目冲突整合

冲突的可能原因:如果两套框架完全没有关系,那么直接使用应该直接使用没有问题,为啥有冲突呢?

经过n次油霸实验,终于找到了原因所在,事实上两个框架代码并没有任何关系,但是在初始化配置的时候的参数设置会出现问题,一个的设置会影响另一个的设置,加入说两者设置完全相同那么没问题,但是两个项目的参数设置不同的话就会出现问题!!!

笔者决定将require框架抛弃,将requirejs中的配置全部搬到dojo的初始化设置中,毕竟dojo中还有arcgis javascript中地图的东西这样稳妥些。

四、amd模式下dojo配置

下面讲解一下dojo中djconfig的参数

/**
 * created by xcy on 2017/4/14.
 */
var xcyip="192.168.70.133";
var webport=":8080";
var gisport=":6080";
var temp=location.pathname;
var package_path='/'+location.pathname.replace(/\/[^/]*$/, '').split("/")[1];
//var package_path='/ggdl/xcyjs';
//模块所处的路径
dojoconfig = {
    has: {
        "dojo-firebug": true,
        "dojo-debug-messages": true
    },
    parseonload: true,
    async: true,
    //baseurl: '/'+location.pathname.replace(/\/[^/]*$/, '').split("/")[1],
    baseurl: package_path+'/3.20/dojo/',
    packages: [
        {name: "application", location: package_path+"/xcyjs"},
        {name:"js",location:package_path+"/js"}
    ],
    shim : {
        'bootstrap' : { 'deps' : ['jquery'] },
        'bmap' : {'deps' : ['jquery'], 'exports': 'bmap'},
        'jquery-ui' : {'deps': ['jquery']},

        'ztree' : {'deps': ['jquery'],exports:'ztree'},
        'ztree-excheck' : {'deps': ['ztree']},
        'ztree-exedit' : {'deps': ['ztree']}
    },
    paths: {
        jquery: package_path+"/js/"+'lib/jquery',
        'jquery-ui' : package_path+"/js/"+'lib/jquery-ui.min',
        handlebars: package_path+"/js/"+'lib/handlebars',
        bootstrap: package_path+"/js/"+'lib/bootstrap',
        'bootstrap-datetimepicker': package_path+"/js/"+'lib/bootstrap-datetimepicker.min',
        echarts :package_path+"/js/"+ 'lib/echarts',
        chalk: package_path+"/js/"+'lib/chalk',
        'jquery-datatables':package_path+"/js/"+ 'lib/jquery-datatables.min',
        layui:package_path+"/js/"+'lib/layui.all',
        'ztree':package_path+"/js/"+'lib/jquery.ztree.core',
        'ztree-excheck':package_path+"/js/"+'lib/jquery.ztree.excheck',
        'ztree-exedit':package_path+"/js/"+'lib/jquery.ztree.exedit',
        jtopo1:package_path+"/js/"+'lib/jtopo',
        bar:package_path+"/js/"+'lib/toolbar',
        module:package_path+"/js/module"
    }
};

1、has()

dojo1.7+采用的配置选项。在has()中可以设置是否启用某个功能例如是否采用firebug调试,是否采用amd的工厂扫描功能:

dojoconfig={

has:{

“dojo-amd-factory-scan”: false,

“dojo-firebug”: true

}

}

2、baseurl

baseurl值是string形式。这个配置项可以重新定义本地或者跨域加载工具箱时的*路径。实践中一般用于自定义module的位置解析。

baseurl的默认路径是dojo.js文件的上一级目录。

比如文件路径为:

/--a
   /--dojo
       /--dojo.js
   /--aaa.js
/--b
   /--bbb.js

当require([aaa].……)的时候,则找的是aaa.js

此时我们要想使用bbb.js,使用require([b/bbb]……)是无法找到的,找到的路径实际路径是/a/b/bbb.js 。此时要修改该baseurl,比如修改baseurl=“/b”,这样require([bbb])……j就可以找到了。

3、package

packages是对象数组。提供了package 名字与路径的键值对。例如:

    packages: [
        {name: "application", location: "/xcyjs"},
        {name:"js",location:"xcyjs"}
    ],

此时相当于为require中引用起了一个别名,require([application/aaa]……),实际路径是/xcyjs/aaa.js,这个是绝对路径,跟baseurl没有关系;

而下面的一个是相对路径require([js/aaa]……),实际路径是baseurl/xcyjs/aaa.js,这个需要注意,绝对路径相对路径绝对路径相对路径绝对路径相对路径!!!

4、path

可以将 module id 映射到不同的文件路径,与package有相同的效果

var dojoconfig = {
    packages: [
        "package1",
        "package2"
    ],
    paths: {
        package1: "../lib/package1",
        package2: "/js/package2"
    }
};

    // ...is equivalent to:
var dojoconfig = {
    packages: [
        { name: "package1", location: "../lib/package1" },
        { name: "package2", location: "/js/package2" }
    ]
};

5、async

设置 dojo core 采用异步加载。值可以为 true, false 或 legacyasync( 将 loader 永久地置为 legacy cross-domain mode)

6、parseonload

parseonload: 设置为true的话,就会使用dojo/parser对象去解析页面加载的dom和依赖(包括定义在dojoconfig.deps中数组)

7、waitseconds

设定模块载入的超时之前的等待时间 缺省值为 0 (永远等待):

讲完这些就差不多够用的了,不过还有个问题,不知道大家记不记得在配置arcgis javascriptapi环境的时候会让你在init,js和dojo,js中修改[hostname_and_path_to_jsapi]为自己的机器的路径。

这个时候我发现init自己初始化的时候会自己做一个判断,当我们不设置baseurl的时候会默认使用我们在init中设置的路径,但是当我们在djconfig中配置baseurl以后他就会默认使用我们设置的baseurl,所以我们最好主动在djconfig文件中配置下baseurl,这样使用起来比较方便。

五、总结

dojo与requirejs的区别

dojo与requirejs项目冲突与解决

dojo中djconfig配置详细解释