Ext.js 环境设置

尝试在线选项

我们已经在线设置了ExtJS编程环境，以便您可以在线编译和执行所有可用的示例。它给你对你正在阅读的信心，并使您能够使用不同的选项验证程序。随意修改任何示例并在线执行。

请尝试以下示例:

<!DOCTYPE html>
<html>
   <head>
      <link href="//cdn.bootcss.com/extjs/6.2.0/classic/theme-classic/resources/theme-classic-all.css" rel="stylesheet" />
      <script type="text/javascript" src="//cdn.bootcss.com/extjs/6.2.0/ext-all.js"></script>
      <script type="text/javascript">
         Ext.onReady(function() {
         Ext.create('Ext.Panel', {
            renderTo: 'helloWorldPanel',
            height: 100,
            width: 200,
            title: 'Hello world',
            html: 'First Ext JS Hello World Program'
            });
         });
      </script>
   </head>
   <body>
      <div id="helloWorldPanel"></div>
   </body>
</html>

尝试一下

对于本教程中给出的大多数示例，您将在我们的网站代码部分下找到“尝试一下”的按钮，将您带到在线编译器。

本地环境设置

本节将指导您如何在机器上下载和设置Ext JS。请按照步骤设置环境。

正在下载库文件

从sencha http://www.bootcdn.cn/下载Ext JS库文件的各个版本。 （1）Javascript文件 常见的JS文件有:

文件和描述
ext.js 这是核心文件，其中包含运行应用程序的所有功能。
ext-all.js 此文件包含在文件中没有注释的所有缩小的代码
ext-all-debug.js 这是ext-all.js的未分级版本，用于调试目的。
ext-all-dev.js 此文件也未分级，用于开发目的，因为它包含所有注释和控制台日志，以检查任何错误/问题
ext-all.js 这个文件用于生产目的，主要是因为它比任何其他小得多。

您可以将这些文件添加到您的项目JS文件夹，或者您可以给出文件驻留在系统中的直接路径。

（2）CSS文件有多个基于主题的文件，您可以在文件夹\\ ext-6.0.1-trial \\ ext-6.0.1 \\ build \\ classic \\ theme-classic \\ resources \\ theme-classic-all.css

如果我们要使用桌面应用程序，那么我们可以使用文件夹\\ ext-6.0.1-trial \\ ext-6.0.1 \\ build \\ classic下的经典主题
如果我们要使用移动应用程序，那么我们将使用现代主题，可以在文件夹\\ ext-6.0.1-trial \\ ext-6.0.1 \\ build \\ modern下找到

这些库文件将添加到Ext JS应用程序中，如下所示:

<html>
   <head>
      <link rel = "stylesheet" type ="text/css" href= "..\ext-6.0.1-trial\ext-6.0.1uild\classic\theme-classic\resources\theme-classic-all.css" />
      <script type ="text/javascript" src = "..\ext-6.0.1-trial\ext-6.0.1uild\ext-all.js" > </script>
      <script type ="text/javascript" src = "app.js" > </script> 
   </head>
</html>

您将在app.js文件中保留ExtJS应用程序代码。

CDN设置

CDN是内容分发网络，您不需要下载Ext JS库文件，您可以直接添加ExtJS的CDN链接到您的程序，如下所示:

<html>
   <head>
      <link rel = "stylesheet" type ="text/css" href= "//cdn.bootcss.com/extjs/6.2.0/classic/theme-classic/resources/theme-classic-all.css" / >
      <script type ="text/javascript" src = "//cdn.bootcss.com/extjs/6.2.0/ext-all.js" > </script>
      <script type ="text/javascript" src = "app.js" > </script> 
   </head>
</html>

浏览器

Ext JS支持跨浏览器兼容性，它支持所有主要浏览器：
IE 6及以上
Firefox 3.6及更高版本
Chrome10及更高版本
Safari 4及以上
Opera 11及以上
您可以使用任何浏览器运行Ext JS应用程序。

转载本站内容时，请务必注明来自W3xue，违者必究。

上一节:Ext.js 概述

下一节:Ext.js 命名约定

优化或报错有奖

友情链接：直通硅谷　点职佳　北美留学生论坛

Ext.js课程

Ext.js 环境设置

尝试在线选项

本地环境设置

正在下载库文件

CDN设置

热门编辑环境

浏览器