博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
ExtJS 4.2 教程-02:bootstrap.js 工作方式
阅读量:6714 次
发布时间:2019-06-25

本文共 1584 字,大约阅读时间需要 5 分钟。

转载自,原文地址:

 

在上一篇中,我们将bootstrap.js引入页面,并没有直接引用ExtJS的脚本文件,而是通过bootstrap在启动的时候动态的选择要将哪些extjs脚本添加到页面中。在本文中我们来介绍一下bootstrap.js的工作方式。

我们在Google Chrome 浏览器中,打开开发人员工具(关于在Google Chrome 浏览器中调试Javascript代码,参考我之前的文章 《》)

打开开发人员工具之后,点击Network标签,然后刷新页面,这时我们就跟踪到了所有文件的请求:

可以看到,尽管我们没有在页面中引用ext-all-dev.js 文件,但页面仍然进行将这个脚本加入了页面的引用,而它的引入者(Initiator 列)是bootstrap.js。

由此可以考出,bootstrap.js 会自动为我们添加ext 的引用,那么它是怎么确定要引用哪个ExtJS文件的呢?我们的目录中有分别有三个文件:

  • ext-all-debug.js:用于调试时引用
  • ext-all-dev.js:用于开发时引用
  • ext-all.js:在发布时引用

所幸我们有bootstrap.js文件的源代码,打开看一下源代码,在注释部分有文件引用的说明:

/** * Load the library located at the same path with this file * * Will automatically load ext-all-dev.js if any of these conditions is true: * - Current hostname is localhost * - Current hostname is an IP v4 address * - Current protocol is "file:" * * Will load ext-all.js (minified) otherwise */

这段注释的大概意思是:

/** * 加载本文件相同路径中的库 * * 满足以下条件将自动加载 ext-all-dev.js: * - 当前主机名是 localhost * - 当前主机名是 IP v4 地址 * - 当前协议是 "file:" * * 其它情况下将加载 ext-all.js (minified) */

很显然,我们的主机名是localhost,bootstrap.js自动为我们加载了 ext-all-dev.js。

我们要验证一下是否在发布环境中,bootstrap能够为我们自动加载ext-all.js,该怎么做呢?

方法是修改我们的 hosts 文件,这个文件在系统盘的 Windows\System32\drivers\etc 中,我们打开这个目录:

打开hosts文件,添加以下两行内容:

127.0.0.1     abc.com127.0.0.1     www.abc.com

hosts 文件的作用就是将DNS服务器的作用,用来将域名 abc.com 和 www.abc.com 解析到我们本机(地址是127.0.0.1)。

接下来我们在浏览器中使用域名来浏览sampleExtJS:

在Network网格中可以看到,这次加载的文件是ext-all.js,这个文件是被压缩过的,可以减少很多网络流量,适合于发布的环境。

如果认为此文对您有帮助,别忘了支持一下哦!

作者:
来源:
声明:本博客原创文字只代表本人工作中在某一时间内总结的观点或结论,与本人所在单位没有直接利益关系。非商业,未授权,贴子请以现状保留,转载时必须保留此段声明,且在文章页面明显位置给出原文连接。
转载:http://www.cnblogs.com/youring2/p/3272559.html
你可能感兴趣的文章
我的Java开发学习之旅------>解惑Java进行三目运算时的自动类型转换
查看>>
【我的Android进阶之旅】解决strings.xml格式化占位符错误: Multiple substitutions specified in non-positional format...
查看>>
测试工程师常用的工具
查看>>
【已解决】如图,说我磁盘不够,看到var目录下有的个隐藏文件夹占了46G,不知道怎么删除...
查看>>
vmware网络的连接方式
查看>>
AngularJs的UI组件ui-Bootstrap分享(五)——Pager和Pagination
查看>>
Python基础21_类与类型, MRO, C3算法, super()
查看>>
IBM磁盘阵列及文件系统的管理
查看>>
Algs4-2.1.34罕见情况
查看>>
jQuery的属性操作
查看>>
BroadcastReceiver
查看>>
Python学习-字典的常见用法
查看>>
Python 异常处理
查看>>
前端 回顾
查看>>
按键精灵是否可以编写函数或方法,简化脚本,使脚本更加模块化?
查看>>
BZOJ3626LCA(树剖+线段树+LCA+差分)
查看>>
事件的产生,传递以及响应链
查看>>
练习4.4 萨提亚冰山理论应用
查看>>
python pandas 对各种文件的读写 IO tools
查看>>
【转】ios 抓取 tcp/udp 包
查看>>