• 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

     

  • 相关阅读:
    maven scope 作用域
    MySQL数据库时区问题导致java程序无法连接数据库
    详细地址正则表达式
    java 重新学习 (七)
    .NET 多平台应用 UI介绍
    WPF关键帧动画
    RFID EPC Gen2 搜索模式和会话
    Razor 常用语法介绍
    Blazor 数据验证(6)
    Blazor 路由与页面导航(5)
  • 原文地址:https://www.cnblogs.com/attilax/p/15198622.html
Copyright © 2020-2023  润新知