手把手教你ExtJS從入門到放棄——篇二(ExtJS程式碼編寫環境搭建，程式碼提示設定及helloworld彈框demo編寫)
使用的myeclipse，別問我為什麼，公司專案大家都用的myeclipse，正好視訊課程也是用myeclipse
軟體準備
分享資源（連結在篇一）裡都有，API也有，不想看視訊的看下面
java開發IDE:myeclipse10 http://www.myeclipseide.com
spket-1.6.23外掛下載 http://download.csdn.net/detail/fionamws/4350925
瀏覽器:FireFox http://firefox.com.cn/download/
資料庫:MySQL下載地址 http://dev.mysql.com/downloads/
Ext開發包，我們可以從官方網站裡進行下載 http://www.sencha.com/products/extjs/download
Ext開發包目錄結構說明
builds目錄為ExtJS壓縮後的程式碼
docs目錄為ExtJS的文件
examples目錄中是官方的演示示例
locale是多國語言的資原始檔,其中ext-lang-zh_CN.js是簡體中文
overview是ExtJS的功能概述 pkgs中是ExtJS各部分功能的打包檔案
resource中書ExtJS要用到的圖片檔案與樣式表文件
src目錄是未壓縮的原始碼 bootstrap.js是ExtJS庫的引導檔案,通過引數可以自動切換ext-all.js和ext-debug.js
ext-all.js檔案是ExtJS的核心庫,是必須要引入的
ext-all-debug.js檔案是-all.extjs的除錯版,在除錯的時候可能需要使用
進入配置開發環境的正題
1.新建工作空間，把workspace與jsp的預設編碼都改為UTF-8
2.把下載好的外掛包放到myeclipse的dropings資料夾下
3.將js的預設開啟編輯器改為如下
4.新增程式碼提示，之前學js的時候沒程式碼提示，都不知道自己怎樣挺過去的，現在沒提示完全受不了，如下：
外掛包新增進去後重新啟動就可以看到Speket目錄，雙擊JavaScript Profile --》new 隨便取個名字我這裡是ExtJS
--》add library 選擇 ExtJS --> add file 選擇下載好的提示檔案，勾選all 這一項即可，注意：全部選中沒效果
helloworld 彈窗小demo編寫
入門java時就是main方法裡控制檯列印 helloworld，2016年九月入java的坑，不知不覺已經兩年了
1.新建web工程
2.若沒有web.xml則要新建，然後配置首頁如下
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>3.index.jsp中內容如下（養成好習慣，js程式碼別寫在jsp裡）
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!-- ext的樣式檔案 -->
<link rel="styleSheet" type="text/css" href="js/extjs/resources/css/ext-all.css" />
<!-- extjs的核心檔案 -->
<script type="text/javascript" charset="utf-8" src="js/extjs/ext-all-debug.js"></script>
<!-- 國際化檔案 -->
<script type="text/javascript" charset="utf-8" src="js/extjs/ext-lang-zh_CN.js"></script>
<script type="text/javascript" charset="utf-8" src="test.js"></script>
</head>
<body>
This is my JSP page. <br>
</body>
</html>4.test.js中內容如下，這裡你還想複製貼上就太懶了
5.將專案部署到tomcat，然後頁瀏覽器訪問效果如下
