zoukankan      html  css  js  c++  java
  • Atitit.js模块化 atiImport 的新特性javascript import

    Atitit.js模块化 atiImport 的新特性javascript import

     

     

    1. 常见的js import规范amd ,cmd ,umd1

    1.1. Require更多流行3

    2. atiImport3

    2.1. Base url的设置4

    2.2. Atiimport的使用4

    2.3. Page load事件的加载要使用windowLoad事件4

    3. 参考4

     

     

    1. 常见的js import规范amd ,cmd ,umd

    五、AMD模块的写法

    require.js加载的模块,采用AMD规范。也就是说,模块必须按照AMD的规定来写。

     

    六、加载非规范的模块

    理论上,require.js加载的模块,必须是按照AMD规范、用define()函数定义的模块。但是实际上,虽然已经有一部分流行的函数库(比如jQuery)符合AMD规范,更多的库并不符合。那么,require.js是否能够加载非规范的模块呢?

    回答是可以的。

     

    作者::  ★(attilax)>>>   绰号:老哇的爪子  全名::Attilax Akbar Al Rapanui 阿提拉克斯 阿克巴 阿尔 拉帕努伊  汉字名:艾龙,  EMAIL:1466519819@qq.com

    转载请注明来源: http://blog.csdn.net/attilax

     

    这样的模块在用require()加载之前,要先用require.config()方法,定义它们的一些特征。

    举例来说,underscore和backbone这两个库,都没有采用AMD规范编写。如果要加载它们的话,必须先定义它们的特征。

      require.config({

        shim: {

          'underscore':{
            exports: '_'
          },

          'backbone': {
            deps: ['underscore', 'jquery'],
            exports: 'Backbone'
          }

        }

      });

    require.config()接受一个配置对象,这个对象除了有前面说过的paths属性之外,还有一个shim属性,专门用来配置不兼容的模块。具体来说,每个模块要定义(1)exports值(输出的变量名),表明这个模块外部调用时的名称;(2)deps数组,表明该模块的依赖性。

     

    1.1. Require更多流行

     

     

    2. atiImport

    Attilax总结...麻烦的..require加载要改写原js文件格式,麻烦。

     

    还是,使用import 机制容易的...

     

    原理如下:::

    动态insert script标签走ok..

     

    // JavaScript Document

    var ImportMap={};

     

    function importx(jsSrc)

    {

    if(ImportMap[jsSrc])

    return;

    ImportMap[jsSrc]=1;

     var oHead = document.getElementsByTagName('HEAD').item(0);

     

        var oScript= document.createElement("script");

     

        oScript.type = "text/javascript";

     

        oScript.src=import_base+jsSrc;

     

        oHead.appendChild( oScript);

    }

     

     

    2.1. Base url的设置

      <script>

     

    var apiurl="/wrmiServlet";

    var import_base="../";

    $ex_show_err_str=true;

        </script>

     

    <script type="text/javascript" src="../com.attilax/core/import.js"></script>

     

    2.2. Atiimport的使用

    importx("com.attilax/dataService/dataServiceV2q329.js");

    importx("com.attilax/web/req.js");

    importx("com.attilax/web/dslUtil.js");

    importx("com.attilax/core/jqUtil.js");

    importx("com.attilax/core/ex.js");

    importx("com.attilax/core/core.js");

    importx("com.attilax/text/str.js");

    importx("com.attilax/web/urlUtil.js");

    importx("com.attilax/ui/Table.js");

     

    2.3. Page load事件的加载要使用windowLoad事件

    最好不个 defer   jq  load都加上,确保js加载完成

    3. 参考

     

    Javascript模块化编程(三):require.js的用法 - 阮一峰的网络日志.html

    动态加载JS脚本的4种方法 - JavaScript - web - ITeye论坛.html

     

  • 相关阅读:
    解决 vs2010 安装过程 提示序列号非法问题
    下载文件(弹出迅雷来下载)
    UrlRewriter URL重写
    C#加密算法汇总
    js 平时经常用的
    c# 解析txt 统计
    漂亮的后台 模板
    无限级分类 父节点 子节点
    FlyTreeView for asp.net (4.4.1.2最新破解版)
    jQueryJSON 无刷新三级联动
  • 原文地址:https://www.cnblogs.com/attilax/p/15198622.html
Copyright © 2011-2022 走看看