3.1 ATM and Back Office language cooperative work Scheme

Source: Internet
Author: User
Tags script tag

First, the landing page to analyze

~/blog/user/account/1.0.0 folder output of the map file, 1.0.0/exports under the import file dependencies are generated in maps {"Settings": {"port": 1234, "Debugparam ":" Debugid "," Domain ":" http://cn-style.gcimg.net/static "}," Maps ": {" user/account:1.0.0/help.css ": {" CSS ": ["/core/reset/1.0.0/reset.css ","/user/account/1.0.0/account.css ","/user/account/1.0.0/exports/h  Elp.css "]," loader ":" "," JS ": []," Onlycss ": true}," User/account:1.0.0/login ": {" CSS ": ["/core/reset/1.0.0/reset.css", "/user/account/1.0.0/account.css", "/user/account/1.0.0/css/login.c SS "]," loader ":"/lib/loader/1.0.0/loader.js "," JS ": ["/user/account/1.0.0/account.js ","/U " Ser/account/1.0.0/exports/login.js "]," onlycss ": false," map ":" Atmjs.setmap ({\ "_alias\": {},\ "alias\": {\ "U Ser/account:1.0.0/other/ajax\ ": \"/user/account/1.0.0/other/ajax.js\ "},\" pkg\ ": {},\" cssdeps\ ": {}});"}, "user/ Account:1.0.0/reg ": {" CSS": ["/core/reset/1.0.0/reset.css ","/user/account/1.0.0/account.css ","/user/account/1.0.0/css/reg.c SS "]," loader ":"/lib/loader/1.0.0/loader.js "," JS ": ["/user/account/1.0.0/account.js ","/U " Ser/account/1.0.0/exports/reg.js "]," ONLYCSS ": false}}}

  

Login page Entry script ID:user/account:1.0.0/login

Then the landing page depends on the information will be from maps['User/account:1.0.0/login '] to obtain, for the moment, Deps expressed

1. deps.css Field

Represents all the CSS files needed for the landing page, each CSS file's actual access address is the URI of each CSS inside the array on the domain connection in the settings field

<link type= "Text/css" rel= "stylesheet" href= "Http://cn-style.gcimg.net/static/core/reset/1.0.0/reset.css"/> <link type= "Text/css" rel= "stylesheet" href= "Http://cn-style.gcimg.net/static/user/account/1.0.0/account.css"/ ><link type= "Text/css" rel= "stylesheet" href= "http://cn-style.gcimg.net/static/user/account/1.0.0/css/ Login.css "/>

2. Deps.loader Field

Because ATM only supports modular development, the module parser file needs to be loaded first, and the Deps.loader field holds the URI of the module parser file.

So before loading other modular JS scripts should be loaded first, the address rule is also the settings field in the domain connection on the module parser URI

<script id= "Atmjsnode" data-base= "http://cn-style.gcimg.net/static" type= "Text/javascript" src= "/HTTP/ Cn-style.gcimg.net/static/lib/loader/1.0.0/loader.js "></script>

Note that the above ID is a fixed value, and the value of Data-base is replaced by the value of the domain field inside the settings

3. Deps.map Field

This field is required because it involves some mapping of the ID and path of the async, but the background language is relatively simple to handle the field, and it is wrapped in a script tag and placed behind the module parser script.

<script type= "Text/javascript" >atmjs.setmap ({"_alias": {}, "Alias": {"User/account:1.0.0/other/ajax": "/user/ Account/1.0.0/other/ajax.js "}," pkg ": {}," Cssdeps ": {}});</script>

4. deps.js Field

The login page requires all the JS files except the module parser, the actual access to each JS file is the URI of each JS inside the array on the domain connection in the settings field.

<script type= "Text/javascript" src= "Http://cn-style.gcimg.net/static/user/account/1.0.0/account.js" ></ Script><script type= "Text/javascript" src= "http://cn-style.gcimg.net/static/user/account/1.0.0/exports/ Login.js "></script>

5. Deps.onlycss

Like the above JSON file inside the user/account:1.0.0/help.css (a simple help page), only need a CSS, do not need JS, so the CSS file as a portal file

That is, if the portal file is a CSS file, the value of this field is true

If the portal file is a JS file, the field is False

If the value of this field is true, none of the above deps.loader,deps.map,deps.js can be output.

6. If the portal file is JS, it needs to be called at the last render portal file, if the portal file is a CSS file (that is, Deps.onlycss is true), you do not need to output the following code

<script type= "Text/javascript" >atmjs.use (' User/account:1.0.0/login ') </script>

In summary: The final output code is:

<!doctype html>

3.1 ATM and Back Office language cooperative work Scheme

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.