Extjs 在开发和生产中,将Ext JS 4.1 MVC应用程序集成到重写URL(mod_rewrite)中
基于Sencha的I中的文件结构部分创建一个新的Ext JS 4.1.1应用程序,最终得到以下结构:Extjs 在开发和生产中,将Ext JS 4.1 MVC应用程序集成到重写URL(mod_rewrite)中,extjs,extjs4,extjs4.1,extjs-mvc,Extjs,Extjs4,Extjs4.1,Extjs Mvc,基于Sencha的I中的文件结构部分创建一个新的Ext JS 4.1.1应用程序,最终得到以下结构: /wwwroot /myapplication /app /controller /view app.js /extjs-4.1.1 app.js文件包含: Ext.Loader.setConfig({ enabled: true }); Ext.application({ app
/wwwroot
/myapplication
/app
/controller
/view
app.js
/extjs-4.1.1
app.js文件包含:
Ext.Loader.setConfig({
enabled: true
});
Ext.application({
appFolder: '/myapplication/app',
autoCreateViewport: true,
name: 'MyApplication',
controllers: [
...
]
});
都很好。然后,我将app.js包含在我的服务器端MVC应用程序中输出(不要与客户端Ext js MVC结构混淆)。服务器端应用程序所使用的语言和结构对此问题并不重要,但输出的结果很重要。在开发过程中,应用程序的URL为:
http://servername/someidentifier1/someidentifier2
与许多应用程序一样,mod_rewrite用于赋予标识符含义,并将URL映射到服务器端代码。这些标识符不映射到“物理”目录。此URL的输出为:
<!DOCTYPE html>
<html>
<head>
<title>MyApplication</title>
<link href="/extjs-4.1.1/resources/css/ext-all-debug.css" media="screen" rel="stylesheet" type="text/css" >
<script type="text/javascript" src="/extjs-4.1.1/ext-debug.js"></script>
<script type="text/javascript" src="/myapplication/app.js"></script>
</head>
<body>
</body>
</html>
我的申请
extjs不是默认的推荐位置,即/wwwroot/myapplication/extjs-4.1.1,而是一个级别,因为它在多个应用程序之间共享。如果您回顾上面的app.js,您还会注意到需要设置appFolder设置,以使其与“不存在”URL一起工作
这一切在开发中都很好,但下一步是使用生成代码的“构建”(问题基于Windows的2.0.0 Beta 3版)。
这就是问题所在。我采取以下步骤:
sencha创建jsb-ahttp://servername/someidentifier1/someidentifier2 -p myapplication.jsb3
生成一个jsb3文件- 没有手动编辑jsb3文件
- 将extjs-4.1.1目录保持在顶层,以便在应用程序之间共享
- 没有app.html文件,因为它从未在服务器端MVC应用程序中使用,否则需要手动更新
- 另外一个好办法是将app.js的内容放在服务器端生成的HTML中,因为这样它就能够接收动态生成的参数
...
appFolder: 'app' // should be enough
...
第二,关于构建和生产之间的差异,我最终得到了两个.html文件——index.html和index-dev.html。这些文件不会被更改(一旦您设置好它们),所以保持它们同步不会有问题
您可以将index-dev.html用于开发需要、调试以及构建过程。基本上,此文件是为本地开发环境配置的
index.html只使用app.js的组合和缩小版本,并配置用于生产部署 使用mod rewrite,您可以使用Symfony中稍微修改的.htaccess文件
<IfModule mod_rewrite.c>
RewriteEngine On
#<IfModule mod_vhost_alias.c>
# RewriteBase /
#</IfModule>
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.*)$ app.php [QSA,L]
</IfModule>
重新启动发动机
#
#重写基/
#
重写cond%{REQUEST_FILENAME}-F
重写规则^(.*)$app.php[QSA,L]
这个文件让你
- 从服务器获取资源,如果它们是真实的文件(css、js、图像等)
- 如果服务器文件系统上没有匹配项,则将url部分转换为查询参数
- 您的SDK工具已过时,因为您可以下载: (v3.0.0)
- 在下面的文档中,您可以使用所需的类进行“构建”,但最终还是需要在开发/生产javascript文件之间手动切换,或者在代码中使用环境变量进行切换
- 实际上,我认为您可以在构建目录中使用一个“假”index.html,由构建工具进行修改,然后在生产代码中,您可以模拟sencha构建生成的代码