您现在的位置： >
ExtJS5.0的加载过程
&&& &&& &&&
目录页&：《》
这里我们借鉴蒋锋老师的一篇文章，感觉更加通俗易懂 官网：
在这里面只引入了一个文件：bootstrap.js。这是一个神奇的文件，他根据配置文件bootstrap.json来设置extjs的类的调用路径、引入css，最后再根据配置文件中的信息，加载app.js。这个文件只要知道这些功能就行了，要了解具体的内部实现，可以去搜索一下相关文章。
2?app.js文件的说明
上面的类中会根据类加载的设置信息，自动为类 app.Application加载文件 /app/Application.js,同样也为app.view.main.Main类找到js文件并加载。
3?Application.js文件
4、Main.js 文件
上面的类是继承自Container的一个容器类，这个类使用了extjs5的mvvm的新特性，
IT学习者（）
上面的属性controller表示当前Main类的控制器为&main&,这个类里没有引用控制器的语句，因此控制器的类名可能是有其默认的加载规则，应该是在当前路径中加载&Main&+&Controller.js&，这个文件作为控制器。viewModel属性定义了ＶＭ的类型，其加载类的规则和上面控制器是一样的。
由于此类是作为一个 autoCreateViewport 属性被加载，加载完成后会立即生成一个实例，并渲染，就是我们看到的网页。
extjs中类的动态加载机制很灵活，这里也不能全部讲到，有不明白的可以查找相关资料。在用sencha cmd 对js 进行编译以后，会将所有的js ,包括用户手工写的和extjs5 sdk中用到的类全部放在一个文件中，发布的时候就只有一个大的js文件。 IT学习者（）
文章除注明转载外，均为原创或编译
欢迎任何形式的转载，但务必请以超链接形式注明出处
本文出自：IT学习者
链接地址：
更多相关资讯
IoService是创建服务的顶层接口，无论服务端还是客户端，都是从它继承.....
评论列表（网友评论仅供网友表达个人看法，并不表明本站同意其观点或证实其描述）
Copyright & 2014
All rights reserved.&&
联系方式(QQ)： |extjs5用sencha cmd创建工程然后build，我添加的scss文件有中文，然后编译出来_百度知道
extjs5用sencha cmd创建工程然后build，我添加的scss文件有中文，然后编译出来
我添加的scss文件有中文extjs5用sencha cmd创建工程然后build.css用gbk编码，然后编译出来的all，怎么改成utf8编码
重新保存下，再重新保存时会有个编码的选择，你再重新选择下保存就可以了
其他类似问题
为您推荐：
sencha的相关知识
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁当前访客身份：游客 [
当前位置：
我在引入Extjs4.2的时候，按如下：
&link href=&ext-4.2.1-gpl/ext-4.2.1.883/resources/css/ext-all.css& rel=&stylesheet& type=&text/css&/& &script src=&ext-4.2.1-gpl/ext-4.2.1.883/bootstrap.js& type=&text/javascript&&&/script& &script src=&ext-4.2.1-gpl/ext-4.2.1.883/ext-all.js& type=&text/javascript&&&/script& &script src=&ext-4.2.1-gpl/ext-4.2.1.883/ext.js& type=&text/javascript&&&/script&
但是页面上确报错了，是什么情况，顺序不对，还是哪个文件没引入，求大神回复
共有2个答案
<span class="a_vote_num" id="a_vote_num_
你只导入这几个文件试试（ext-all.gzjs这个不是，不用管这个），一般来说页面来说只需导入ext-all.js与css就好了，（ 中文的话需要导入ext-lang-zh_CN.js）;
<span class="a_vote_num" id="a_vote_num_
这个不是你引入文件的不对，或者文件没引入，看控制台的的信息，是你取得的一个object没有addCls方法，你可以调试看看，在你调用addCls的地方，看看是不是应该object里面的东西或者ojbect上一级的东西才能调用addCls。如果是文件没引入的话，一般报错都是Ext.xxxxx.xxx.xxx没找到什么的
更多开发者职位上
有什么技术问题吗？
冬天的雪的其它问题3368人阅读
ExTJS（160）
在Ext JS 5，使用了新的脚本和样式加载方式，这对于将应用程序导入到Web项目中产生了点小麻烦。而对于本地化文件的导入，也采用了新的方式，本文将一一解答这些问题。将Ext JS 5应用程序导入Web项目在Ext JS 5，会使用bootstrap.js来加载应用程序脚本和样式，而bootstrap.js是根据Bootstrap.json来加载样式文件和脚本的。问题就在这个Bootstrap.json文件上，如果是使用IIS的Web项目，首先会碰到的问题是Web服务器不允许下载JSON文件，这时候，就得先解决这个问题，不然加载肯定会出错。如果认真研究一下bootstrap.js文件，会发现它主要用来获取脚本和样式文件的地方是Bootstrap.json中的js和css成员值。在自动生成的Bootstrap.json文件中，脚本和样式文件的默认路径就是没有路径，也就是与首页文件是同一路径，这样，当首页文件与脚本和样式文件不在同一路径，就加载不了脚本和样式了。由于Bootstrap.json文件中要加载的脚本文件很多，要直接修改Bootstrap.json文件中的文件的路径，不太现实。那就只能在bootstrap.js文件中找寻解决方案了。在bootstrap.js文件中，Ext.Microloader的load方法会读取Bootstrap.json中的js和css成员的值，然后将这些值通过以下语句将脚本和样式文件的加载路径放到一个数组内：urls.push(resource.path);以上语句并没有对脚本或文件的路径进行任何修改，直接就放到加载数组里了，这样在首页文件与脚本不在同一路径的时候肯定会出错，因而，要修正这个问题，只要修改这句就行了，也就是为要加载的脚本和样式加上一个合适的路径。再研究下bootstrap.js文件，会发现在Boot的init方法中，会把bootstrap.js在首页中的路径保存在Boot.baseUrl中，而bootstrap.js的路径是与bootstrap.json的路径是相同的，也就是说bootstrap.json中要加载的脚本和样式的相对路径与bootstrap.js的相对路径是一样的，因而，将上面的代码修改为以下代码就能正确加载脚本和样式了：urls.push(Boot.baseUrl + resource.path);以上只是解决了Ext JS的框架文件和样式的路径，对于应用程序本身的类文件来说，他们的路径还是错误 ，而要修正这个错误，很简单，只需要在app.js和app\application.js中添加appFolder来指定应用程序等待命名空间的路径就行了，例如，脚本是放在Web项目的Scripts目录的，则代码如下：appFolder : 'scripts/app',经过以上修改，就可以将应用程序正确的导入Web项目了。本地化由于采用了bootstrap.js文件来启动应用程序，因而不建议再采用之前的直接在页面中加载本地化文件的方式来加载本地化文件，而且，这样的加载方式还存在先加载应用程序，再加载本地化文件的加载顺序问题，可能会出现意想不到的错误。在Ext JS 5，要正确加入本地化文件，需要修改app.json文件，在app.json的requires成员数组中添加ext-locale，意思就是应用程序要求加载本地化包，但没具体说要加载那个本地化包，因而，还需要添加locale成员，来指定需要加载哪个本地化包，如果只加载简体包，值可以是zh_CN，如果要加载多个本地化包，则值可以是数组，将本地化包的特征代码加入其中，具体例子如下：
&requires&: [
'ext-locale'
&locale&: &zh_CN&,
修改app.json文件之后，还需要执行一次sencha app build命令才能实现本地化。发布应用程序使用sencha app build命令打包后，还是会存在路径问题。这时候，bootstrap.js文件会以压缩形式放在首页里，要修改它不太容易，但这时候bootstrap.js会以app.json为脚本文件和样式文件的加载依据，而这时候的app.json文件只需要两个一个脚本文件app.js和一个样式文件MyApp-all.css，因而直接修改app.json文件中这两个文件的路径就行了。
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：1117285次
积分：13029
积分：13029
排名：第481名
原创：137篇
转载：28篇
译文：98篇
评论：2083条
阅读：6544
文章：22篇
阅读：55925
文章：29篇
阅读：107954
(1)(1)(2)(7)(7)(7)(3)(2)(1)(2)(3)(2)(3)(4)(5)(3)(9)(5)(2)(4)(6)(3)(2)(1)(1)(3)(3)(4)(7)(2)(4)(4)(8)(4)(12)(2)(4)(8)(2)(3)(2)(2)(1)(3)(3)(3)(1)(1)(4)(7)(8)(5)(3)(8)(2)(1)(2)(1)(1)(1)(1)(2)(4)(1)(1)(2)(2)(2)(2)(4)(1)(3)(1)(5)(4)(1)(1)(1)(1)(1)(1)(1)(2)(1)(3)17290人阅读
跟我一起学extjs5（41）
跟我一起学extjs5(03--项目中文件的加载过程)
上一节中用sencha工具自动创建了一个项目，并且可以在浏览器中查看。现在我们来看看js类加载过程。如下图所示：
1?首先：浏览器中输入 localhost:1841 ，调用 index.
&!DOCTYPE HTML&
&meta charset=&UTF-8&&
&title&app&/title&
&!-- The line below must be kept intact for Sencha Cmd to build your application --&
&script id=&microloader& type=&text/javascript& src=&bootstrap.js&&&/script&
&body&&/body&
& & & & 在这里面只引入了一个文件：bootstrap.js。这是一个神奇的文件，他根据配置文件bootstrap.json来设置extjs的类的调用路径、引入css，最后再根据配置文件中的信息，加载app.js。这个文件只要知道这些功能就行了，要了解具体的内部实现，可以去搜索一下相关文章。
2?app.js文件的说明
Ext.application({
name: &#39;app&#39;,//应用的名称app
extend: &#39;app.Application&#39;,
//继承自app.Application,这个文件是 app/Application.js
autoCreateViewport: &#39;app.view.main.Main&#39;
//自动创建的Viewport的类名,文件在 app/view/main/Main.js
上面的类中会根据类加载的设置信息，自动为类 app.Application加载文件 /app/Application.js,同样也为app.view.main.Main类找到js文件并加载。
3?Application.js文件
Ext.define(&#39;app.Application&#39;, {
extend : &#39;Ext.app.Application&#39;,
name : &#39;app&#39;,
views : [], // ＭＶＣ用到的view
controllers : [&#39;Root&#39;
// MVC控制器的名称，会自动到 /app/controller下去加载同名的js文件
// 对于Root,会去自动加载 /app/Controller/Root.js 这个文件
stores : [],
launch : function() {
// 需要执行的语句可以加在此处
4、Main.js 文件
Ext.define(&#39;app.view.main.Main&#39;, {
extend: &#39;Ext.container.Container&#39;,
xtype: &#39;app-main&#39;,
controller: &#39;main&#39;,
//MVVM架构的控制器的名称，会在当前路径中根据‘Main’ + Controller 来确定文件名
//这个我没找到其他任何可以自动加载MainController.js的依据，只能作上面的判断了
viewModel: {
type: &#39;main&#39;
//MVVM架构的viewModel的类型，会在当前路径中根据‘Main’ + Model 来确定文件名
type: &#39;border&#39;
//系统的主页面的布局
xtype: &#39;panel&#39;,
title: &#39;{name}&#39;
region: &#39;west&#39;,
//左边面板
html: &#39;&ul&&li&This area is commonly used for navigation, for example, using a &tree& component.&/li&&/ul&&#39;,
width: 250,
split: true,
text: &#39;Button&#39;,
handler: &#39;onClickButton&#39;
region: &#39;center&#39;,
//中间面版
xtype: &#39;tabpanel&#39;,
title: &#39;Tab 1&#39;,
html: &#39;&h2&Content appropriate for the current navigation.&/h2&&#39;
上面的类是继承自Container的一个容器类，这个类使用了extjs5的mvvm的新特性，
controller: &#39;main&#39;,
//MVVM架构的控制器的名称，会在当前路径中根据‘Main’ + Controller 来确定文件名
//这个我没找到其他任何可以自动加载MainController.js的依据，只能作上面的判断了
viewModel: {
type: &#39;main&#39;
//MVVM架构的viewModel的类型，会在当前路径中根据‘Main’ + Model 来确定文件名
上面的属性controller表示当前Main类的控制器为&main&,这个类里没有引用控制器的语句，因此控制器的类名可能是有其默认的加载规则，应该是在当前路径中加载“Main”&#43;&Controller.js&，这个文件作为控制器。viewModel属性定义了ＶＭ的类型，其加载类的规则和上面控制器是一样的。
由于此类是作为一个 autoCreateViewport 属性被加载，加载完成后会立即生成一个实例，并渲染，就是我们看到的网页。
extjs中类的动态加载机制很灵活，这里也不能全部讲到，有不明白的可以查找相关资料。在用sencha cmd 对js 进行编译以后，会将所有的js ,包括用户手工写的和extjs5 sdk中用到的类全部放在一个文件中，发布的时候就只有一个大的js文件。
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：407012次
积分：5655
积分：5655
排名：第2414名
原创：123篇
评论：675条
文章：25篇
阅读：15782
文章：41篇
阅读：286178
文章：45篇
阅读：66950
(5)(7)(3)(6)(4)(1)(1)(1)(9)(7)(20)(9)(23)(18)(1)(1)(1)(1)(3)(3)}